Androidにキャラクターを表示する

tamuraです。

ゲームを作るにあたって32x32で描いたキャラクターをどう表示させるか、Androidは画面サイズが決まっていないためdpという単位があるらしい?ということを聞いていたので、実際に32x32を表示してやってみました。

Viewの作成

キャラクタ表示用のViewを作ります。

class CharacterView : View {

    private val bitmap: Bitmap;
    private val paint: Paint;

    init {
        bitmap = BitmapFactory.decodeResource(context.resources, R.drawable.block)
        paint = Paint()
    }

    constructor(context: Context): this(context, null)
    constructor(context: Context, attrs: AttributeSet?): super(context, attrs)

    override fun onDraw(canvas: Canvas?) {
        canvas?.drawBitmap(bitmap, 0f, 0f, paint)
    }

}

activity_main.xml の編集

今回は画面サイズを指定します。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="640dp"
        android:layout_height="960dp"
        tools:context=".MainActivity">

    <com.github.tamurashingo.android_test_view_2.views.CharacterView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

実行結果

こんな感じになりました。

32px横にずらす

画像サイズが32pxなので32pxずらしたらどうなるかやってみました。

    override fun onDraw(canvas: Canvas?) {
        canvas?.drawBitmap(bitmap, 0f, 0f, paint)
        canvas?.drawBitmap(bitmap, 32f, 0f, paint)
    }

だめでした。

dp, pxの変換

dp↔px変換サンプルコード こちらを参考にpxをdpに変換しました。

右に32dp(論理座標)移動させる → 32dpをxxxpx(物理座標)に変換 → 配置

    override fun onDraw(canvas: Canvas?) {
        canvas?.drawBitmap(bitmap, convertDp2Px(0f), convertDp2Px(0f), paint)
        canvas?.drawBitmap(bitmap, convertDp2Px(32f), convertDp2Px(0f), paint)
    }

    fun convertDp2Px(dp: Float): Float {
        return dp * context.resources.displayMetrics.density
    }

実行結果

良いんではないでしょうか。

関連記事

comments powered by Disqus