カスタムビューの作り方

ビューの上に何か図形を描きたいときはカスタムビューを定義してその中でCanvasクラスを使って図形を描きます。

カスタムビューの作成

では線を引くビューとしてLineViewというビューを作ってみます。コードは次の通りです。

LineView.java

package com.MyApp.myapp;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;

public class LineView extends View
{
    
    public GraphView(Context context, AttributeSet attrs) 
    {
        super(context, attrs);
    }

    @Override
    protected void onDraw(Canvas canvas)
    {
        super.onDraw(canvas);
        Paint paint = new Paint();
        paint.setColor(Color.BLUE);
            //描画に使う色を指定
        canvas.drawLine(0, 0, 100, 100, paint);
            //線を引く。
    }
}

このビュークラスをアプリと同じパッケージのなかに作ります。(例えばcom.MyApp.myappなど)

このカスタムクラスではonDrawメソッドの中でビューに(0, 0)から(100, 100)までの間に1本の青色の線を引いています。

カスタムビューをレイアウトに設置する

次にレイアウトファイルに作成したカスタムビューを設置します。

activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:orientation="vertical" >
        <com.MyApp.myapp.GraphView
            android:id="@+id/line_view" 
            android:layout_width="wrap_content" 
            android:layout_height="160dp" 
            android:focusable="true" />
</LinearLayout>

図形を描画するときなどはビューの高さが定まっていないのでこのようにレイアウト中で具体的な長さ(160dpなど)を指定したり、またはコード中から指定をしなければビューが表示されません。

ビューの表示

最後にアクティビティ上で図形ビューを表示します。コードは次の通りです。

MainActivity.java

public class MainActivity extends Activity 
{
    @Override
    protected void onCreate(Bundle savedInstanceState) 
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

画面上には線が描画されます。