Android 文字と画像を重ねるLayoutにおいて，xmlでリソース定義する方法

Question

Android Studioにて開発を行っています．Androidで，FrameLayoutを用いて重ねたImageViewとTextViewに対して，動的にリソースを指定したいです．しかし，今書いているコードでは，include文が必要になり，独自リソース定義を使うことができません．どういったコードを書けば，

• 縦横比を問わず，Layout内いっぱいに画像を引き延ばす
• 画像の中央に文字を重ねる
• xmlから，リソース指定して画像やテキストを変更可能

という要件を満たせるのでしょうか．

最後に載せるソースコードが現状のコードになりますが，これらのコードでは，includeにてxmlに組み込むことになり，独自定義のリソースを認識していないようです．(nullになる．)

よろしくお願いします．

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <include layout="@layout/my_image_text_view"
        android:id="@+id/cafeImageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:mySrc="@drawable/example"
        app:myText="Example"/>
</LinearLayout>

---

java/com.example.mine/view/MyImageTextView.java

package com.example.mine.view;

/* import 文は省略*/

public class MyImageTextView extends FrameLayout {

    private AttributeSet attrs;

    public MyImageTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.attrs = attrs;
    }

    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        init();
    }

    private void init() {
        final TextView textView = (TextView) findViewById(R.id.myTextView);
        final ImageView imageView = (ImageView) findViewById(R.id.myImageView);

        final TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.MyImageTextView);

        final Drawable resourceId = typedArray.getDrawable(R.styleable.MyImageTextView_mySrc);
        if(resourceId!=null)
            imageView.setImageDrawable(resourceId);

        final String text = typedArray.getString(R.styleable.MyImageTextView_myText);
        textView.setText(text);

        typedArray.recycle();
    }

}

res/layout/my_image_text_view.xml

<com.example.mine.view.MyImageTextView xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <!--xmlns:app="http://schemas.android.com/apk/res-auto"-->
    <ImageView
        android:id="@+id/myImageView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:scaleType="fitXY" />

    <TextView
        android:id="@+id/myTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textAppearance="?android:attr/textAppearanceLarge" />

</com.example.mine.view.MyImageTextView>

res/values/attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="MyImageTextView">
        <attr name="mySrc" format="reference" />
        <attr name="myText" format="string" />
    </declare-styleable>
</resources>

Answer 1

xmlで書かずに，ソースコード内でinflateすることでとりあえず解決しました．

public class ImageTextView extends FrameLayout {

    public ImageTextView(Context context) {
        super(context);
        init(context);
    }

    public ImageTextView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs, 0);
    }

    public ImageTextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs, defStyleAttr);
    }

    private final void init(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {

        final ImageView imageView = new ImageView(context, attrs, defStyleAttr);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        final TextView textView = new TextView(context, attrs, defStyleAttr);
        textView.setGravity(Gravity.CENTER);


        // assetはcloseしない！
        // asset.close();

        final TypedArray a = context.obtainStyledAttributes(
                attrs, R.styleable.MyImageTextView);

        final CharSequence text = a.getText(R.styleable.MyImageTextView_myText);
        textView.setText(text);

        final int resourceId = a.getResourceId(R.styleable.MyImageTextView_mySrc, 0);
        imageView.setImageResource(resourceId);

        textView.setTextAppearance(context, android.R.style.TextAppearance_Large);

        a.recycle();

        final AssetManager asset = context.getAssets();
        textView.setTypeface(Typeface.createFromAsset(asset, "erasbd.ttf"));

        addView(imageView);
        addView(textView);
    }


    private final void init(Context context) {

        final ImageView imageView = new ImageView(context);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        final TextView textView = new TextView(context);
        textView.setEllipsize(TextUtils.TruncateAt.MARQUEE);
        textView.setGravity(Gravity.CENTER);

        final AssetManager asset = context.getAssets();
        textView.setTypeface(Typeface.createFromAsset(asset, "erasbd.ttf"));

        addView(imageView);
        addView(textView);
    }

}

Answer 2

includeを使わなければならない理由とは何でしょうか？
<com.example.mine.view.MyImageTextView></com.example.mine.view.MyImageTextView>上記のタグを直接使うことで解決できそうですが。

Comments

[退会済みユーザー]

<com.example.mine.view.MyImageTextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:mySrc="@drawable/example"
app:myText="Example">

<ImageView
android:id="@+id/myImageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:scaleType="fitXY" />

<TextView
android:id="@+id/myTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textAppearance="?android:attr/textAppearanceLarge" />

</com.example.mine.view.MyImageTextView>
として使うということでしょうか？これではソースコードの削減につながらないため，自分の目標の動作ではありません．すみません．

[yona]

違います。
includeの箇所です。

[退会済みユーザー]

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<com.example.mine.view.MyImageTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:mySrc="@drawable/example"
app:myText="Example">
</com.example.mine.view.MyImageTextView>
</LinearLayout>
でしょうか？これでは，MyImageTextViewの中に，ImageViewやTextViewがないため，上手くいきません．

[yona]

現状のままではダメですね。
MyImageTextViewのコンストラクタに下記を追記してください。
View layout = LayoutInflater.from(context).inflate(R.layout.myview, this);

参考:http://zawapro.com/?p=1534

[yona]

質問に対する根本的な対処ではない回答で解決済みになったことを残念に思います。