2016-07-13 15 views
2

どのようにしてアンドロイド透明グラデーションの背景に線形レイアウトを与えることができますか?レイアウトは現在背景がぼやけていますが、ぼやけたイメージはレイアウトの上部でわずかに透明にする必要があります。それからその底部で不透明になります。グラデーション透明の背景を持つAndroid線形のレイアウト

レイアウトはパララックススクロールビューにネストされているため、レイアウトはヘッダーイメージの上にスライドできます。

私はそうのようなぼやけた描画可能なを生成します。

final View content = img_header; 
    if (content.getWidth() > 0) { 
     Bitmap image = BlurBuilder.blur(content); 
     BitmapDrawable background = new BitmapDrawable(image); 

     ll_parent_layout.setBackground(background); 
    } else { 
     content.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { 
      @Override 
      public void onGlobalLayout() { 
       Bitmap image = BlurBuilder.blur(content); 
       BitmapDrawable background = new BitmapDrawable(image); 
       ll_parent_layout.setBackground(background); 
      } 
     }); 
    } 

ぼかしビルダーは次のようになります。

public class BlurBuilder { 
private static final float BITMAP_SCALE = 1f; 
private static final float BLUR_RADIUS = 25f; 

public static Bitmap blur(View v) { 
    return blur(v.getContext(), getScreenshot(v)); 
} 

public static Bitmap blur(Context ctx, Bitmap image) { 
    int width = Math.round(image.getWidth() * BITMAP_SCALE); 
    int height = Math.round(image.getHeight() * BITMAP_SCALE); 

    Bitmap inputBitmap = Bitmap.createScaledBitmap(image, width, height, false); 
    Bitmap outputBitmap = Bitmap.createBitmap(inputBitmap); 
    /// compress bitmap here 

    RenderScript rs = RenderScript.create(ctx); 
    ScriptIntrinsicBlur theIntrinsic = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs)); 
    Allocation tmpIn = Allocation.createFromBitmap(rs, inputBitmap); 
    Allocation tmpOut = Allocation.createFromBitmap(rs, outputBitmap); 
    theIntrinsic.setRadius(BLUR_RADIUS); 
    theIntrinsic.setInput(tmpIn); 
    theIntrinsic.forEach(tmpOut); 
    tmpOut.copyTo(outputBitmap); 

    return outputBitmap; 
} 

public static Bitmap blur(Context ctx, Bitmap image, float scale, float radius) { 
    int width = Math.round(image.getWidth() * scale); 
    int height = Math.round(image.getHeight() * scale); 

    Bitmap inputBitmap = Bitmap.createScaledBitmap(image, width, height, false); 
    Bitmap outputBitmap = Bitmap.createBitmap(inputBitmap); 

    RenderScript rs = RenderScript.create(ctx); 
    ScriptIntrinsicBlur theIntrinsic = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs)); 
    Allocation tmpIn = Allocation.createFromBitmap(rs, inputBitmap); 
    Allocation tmpOut = Allocation.createFromBitmap(rs, outputBitmap); 
    theIntrinsic.setRadius(radius); 
    theIntrinsic.setInput(tmpIn); 
    theIntrinsic.forEach(tmpOut); 
    tmpOut.copyTo(outputBitmap); 

    return outputBitmap; 
} 


private static Bitmap getScreenshot(View v) { 
    Bitmap b = Bitmap.createBitmap(v.getWidth(), v.getHeight(), Bitmap.Config.ARGB_8888); 
    Canvas c = new Canvas(b); 
    v.draw(c); 
    return b; 
} 
} 
+0

drawableのコードを投稿できますか? –

+0

@KaranMerの投稿はリクエストに応じて編集されました – MichaelStoddart

+0

あなたはこれにdrawableリソースを使用していませんか? –

答えて

1

ぼかし画像を生成するためにBitmapを操作しているので、LinearGradientシェーダを使用して、this answerのように透明度を追加できます。

public Bitmap addGradient(Bitmap src) { 
    int w = src.getWidth(); 
    int h = src.getHeight(); 
    Bitmap overlay = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888); 
    Canvas canvas = new Canvas(overlay); 

    canvas.drawBitmap(src, 0, 0, null); 

    Paint paint = new Paint(); 
    LinearGradient shader = new LinearGradient(0, 0, 0, h, 0xFFFFFFFF, 0x00FFFFFF, Shader.TileMode.REPEAT); 
    paint.setShader(shader); 
    paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN)); 
    canvas.drawRect(0, h - h, w, h, paint); 

    return overlay; 
} 
+0

チャームのように働いて、私は少なくとも1週間これのための解決策を探していました! – MichaelStoddart

+0

今、この解決策に問題があります。ぼやけた画像が黒い背景では、グラデーションが始まる線を見ることができます。以前にこの問題があったことがありますか? – MichaelStoddart

0

あなたは以下のようにあなたのレイアウトにグラデーションを設定する描画可能なXMLを使用することができます。

以下のコードをmybg.xmlというファイルに置き、drawableフォルダ内に配置します。色について

<shape 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle" 
> 
    <gradient 
     android:startColor="@color/mycolor1" 
     android:endColor="@color/mycolor2" 
     android:angle="270" /> 
</shape> 

利用8チャーハッシュコードあなたの色は次のようにすることができるので、ここでこの

mycolor1 -> #000000aa //this will give you transparent colored background 
mycolor2 -> #ff00aa00 //this will be opaque like background 

最初の二つの文字は色のアルファレベルを設定します。

0

はそれをこのように行うことができます。

をちょうど はまた、あなたが

背景グラデーションの一部のみを透明にすることができます(> = 0と< = 1)fadingPortion値を使用して、ビットマップが変更可能であることを確認してください
public static Bitmap makeBitmapTransparent(Bitmap mutableBitmap, float fadingPortion) { 
    final Shader gradientShader = new LinearGradient(
      mutableBitmap.getWidth()/2, 0, 
      mutableBitmap.getWidth()/2, mutableBitmap.getHeight() * fadingPortion, 
      0x00000000, 0xFF000000, 
      Shader.TileMode.CLAMP); 

    Paint paint = new Paint(); 
    paint.setShader(gradientShader); 
    paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN)); 

    Canvas canvas = new Canvas(mutableBitmap); 
    canvas.drawRect(new Rect(0, 0, mutableBitmap.getWidth(), (int) (mutableBitmap.getHeight() * FADING_PORTION)), paint); 
    canvas.drawBitmap(mutableBitmap, 0, 0, null); 

    return mutableBitmap; 
} 
+0

私は何をフェード部分として渡しますか? – MichaelStoddart

+0

0〜1の範囲の浮動小数点(例えば)は、上位四半期だけが勾配的に透明になることを意味します – Sharpe

関連する問題