user icon

Androidで影を描いてみる。

ずっと前からブログのネタとして暖めていた、Androidで影を描く方法を書きたいと思います。

先に書いたソースを載せます。


import android.content.Context;
import android.graphics.BlurMaskFilter;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.view.View;

public class ShadowView extends View {

private Paint white = null;
private Paint black = null;
private Paint shadow = null;

private RectF rect = null;
private RectF shadowRect = null;

public ShadowView(Context context) {
super(context);

white = new Paint();
white.setColor(Color.WHITE);
white.setAntiAlias(true);

black = new Paint();
black.setStyle(Paint.Style.STROKE);
black.setAntiAlias(true);

shadow = new Paint();
shadow.setStyle(Paint.Style.FILL);
shadow.setColor(Color.argb(112, 0, 0, 0));
BlurMaskFilter blur = new BlurMaskFilter(8, BlurMaskFilter.Blur.NORMAL);
shadow.setMaskFilter(blur);

rect = new RectF(50f,100f,250f,200f);

float diff = 30f;
shadowRect = new RectF(50f + diff,100f + diff,250f + diff,200f + diff);
}

@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);

//背景を描画
drawBackground(canvas);

//角丸の矩形の影
canvas.drawRoundRect(shadowRect, 50, 50, shadow);

//角丸の矩形の背景(白)
canvas.drawRoundRect(rect, 50, 50, white);

//角丸の矩形の枠線(黒)
canvas.drawRoundRect(rect, 50, 50, black);
}

/**
 * 背景を描画
 * @param canvas
 */
private void drawBackground(Canvas canvas){
Paint paint = new Paint();
paint.setColor(Color.rgb(214, 233, 255));

int height = getHeight();
int width = getWidth();

int y = 0;
while(y

0)影が分かりやすいようになんとなく用意した背景

1)まず影をつけたいものを描きます。

2)それを右下にずらした矩形を作ります。

右下に30ずらしてます。
rect = new RectF(50f,100f,250f,200f);

float diff = 30f;
shadowRect = new RectF(50f + diff,100f + diff,250f + diff,200f + diff);

3)それを影っぽいペイントで描画します。

4)あとは、影→背景→枠の順で描画して完了。

なんか書いてみたら、ずっと暖めていた割に簡単だった・・。
暖めすぎたか・・。

ポイントは、影のペイントは、ぼかし効果をいれるところです。
BlurMaskFilter blur = new BlurMaskFilter(8, BlurMaskFilter.Blur.NORMAL);

Facebooktwitterlinkedintumblrmail

タグ:

Trackback

Comment

  • 1.
  • ura
  • 2012/11/13 23:48

グリッドが何気にクールやね。

グリッドは、xcodeをちょっと真似してみました。汗

名前
E-mail
URL
コメント

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)