android - レイアウトオーバーフローコンポーネント

Question

私TextViewの文字列が大きくなってオーバーフローし、別のテキストを隠したり、TextView消え始めたりすると問題が発生します。

私はそれがこのように動作することを望みます（これはスイングによく似ていることは知っていますが、FlowLayout配置が固定されておらず、1つのコンポーネントが左に配置され、もう1つのコンポーネントが右に配置されているため、完全ではありません）：

 -------------------------------------
|[TextView0]               [TextView1]|
 -------------------------------------

そして、テキストが大きくなると:

    TextView0 grows:                        TextView1 grows:
 -------------------------------------    -------------------------------------
|[TextView0 TextView0 TextView0]      |  |[TextView0]                          |
|                          [TextView1]|  |      [TextView1 TextView1 TextView1]|
 -------------------------------------    -------------------------------------

既存のレイアウトで (おそらくレイアウトの組み合わせを使用して) 実行できますか?
新しいレイアウトを作成する必要がある場合は、実際の例が必要です。

私は試してみましたが、うまくReleativeLayoutいきLinearLayoutませんでした：

RelativeLayout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/TextView0"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:text="TextView0" />

    <TextView
        android:id="@+id/TextView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="TextView1" />
</RelativeLayout>

テキストがオーバーラップし始めたとき、それを修正しようとしましTextView0たtoLeftOf="TextView1"。しかし、その場合TextView0は消えます。

LinearLayout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/TextView0"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TextView0" />

    <TextView
        android:id="@+id/TextView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="right"
        android:text="TextView1" />
</LinearLayout>

ここでTextViews が干渉し始め、TextView0取得すると全幅TextView1が消えます (幅がゼロに近づきます)。

score 1 · Accepted Answer

そのAndroid-FlowLayoutに最適なライブラリの 1 つは、
シンプルで使いやすく、素晴らしいものです。

score 0 · Accepted Answer

この目的のためにレイアウトを作成しようとしました。

元の質問で説明したように機能しますが、改善した場合は自由に回答を更新してください!

public class KeyValueLayout extends ViewGroup {

    public KeyValueLayout(Context context) {
        super(context);
    }

    public KeyValueLayout(Context context, AttributeSet attributeSet) {
        super(context, attributeSet);
    }

    public KeyValueLayout(Context context, AttributeSet attributeSet, 
                          int defStyle) {
        super(context, attributeSet, defStyle);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

        int paddRight = getPaddingRight();
        int paddLeft = getPaddingLeft();
        int paddBottom = getPaddingBottom();
        int paddWidth = paddRight + paddLeft;

        int sizeWidth  = MeasureSpec.getSize(widthMeasureSpec) - paddWidth;
        int sizeHeight = MeasureSpec.getSize(heightMeasureSpec) - paddWidth;

        int modeWidth  = MeasureSpec.getMode(widthMeasureSpec);
        int modeHeight = MeasureSpec.getMode(heightMeasureSpec);

        int modeW = modeWidth == MeasureSpec.EXACTLY 
                        ? MeasureSpec.AT_MOST : modeWidth;
        int modeH = modeHeight == MeasureSpec.EXACTLY 
                        ? MeasureSpec.AT_MOST : modeHeight;

        // where the next view should be placed
        int lineYPosition = 0;

        for (int i = 0; i < getChildCount(); ) {

            View key = getChildAt(i++);

            key.measure(
                    MeasureSpec.makeMeasureSpec(sizeWidth, modeW),
                    MeasureSpec.makeMeasureSpec(sizeHeight, modeH)
            );

            LayoutParams keyLp = (LayoutParams) key.getLayoutParams();
            keyLp.setPosition(paddLeft, lineYPosition);

            if (i >= getChildCount()) 
                break;

            View val = getChildAt(i++);

            val.measure(
                    MeasureSpec.makeMeasureSpec(sizeWidth, modeW),
                    MeasureSpec.makeMeasureSpec(sizeHeight, modeH)
            );

            LayoutParams valLp = (LayoutParams) val.getLayoutParams();

            int valXPosition = paddLeft + sizeWidth - val.getMeasuredWidth();

            // check if both fit on the same line
            if (key.getMeasuredWidth() + val.getMeasuredWidth() <= sizeWidth) {

                valLp.setPosition(valXPosition, lineYPosition);

                lineYPosition += Math.max(key.getMeasuredHeight(), 
                                          val.getMeasuredHeight());
            } else {

                // not enough room, make some space 
                lineYPosition += key.getMeasuredHeight();

                valLp.setPosition(valXPosition, lineYPosition);

                lineYPosition += val.getMeasuredHeight();
            }
        }

        int controlMaxLength = sizeWidth + paddRight; 
        int controlMaxThickness = lineYPosition + paddBottom;

        int resolvedWidth = resolveSize(controlMaxLength, widthMeasureSpec);
        int resolvedHeight =resolveSize(controlMaxThickness,heightMeasureSpec);
        this.setMeasuredDimension(resolvedWidth, resolvedHeight);
    }

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        final int count = getChildCount();
        for (int i = 0; i < count; i++) {
            View child = getChildAt(i);
            LayoutParams lp = (LayoutParams) child.getLayoutParams();
            child.layout(lp.x, lp.y, 
                         lp.x + child.getMeasuredWidth(), 
                         lp.y + child.getMeasuredHeight());
        }
    }

    @Override
    protected boolean checkLayoutParams(ViewGroup.LayoutParams p) {
        return p instanceof LayoutParams;
    }

    @Override
    protected LayoutParams generateDefaultLayoutParams() {
        return new LayoutParams(LayoutParams.WRAP_CONTENT, 
                                LayoutParams.WRAP_CONTENT);
    }

    @Override
    public LayoutParams generateLayoutParams(AttributeSet attributeSet) {
        return new LayoutParams(getContext(), attributeSet);
    }

    @Override
    protected LayoutParams generateLayoutParams(ViewGroup.LayoutParams p) {
        return new LayoutParams(p);
    }

    public static class LayoutParams extends ViewGroup.LayoutParams {

        private int x;
        private int y;

        public LayoutParams(Context context, AttributeSet attributeSet) {
            super(context, attributeSet);
        }

        public LayoutParams(int width, int height) {
            super(width, height);
        }

        public LayoutParams(ViewGroup.LayoutParams layoutParams) {
            super(layoutParams);
        }

        public void setPosition(int x, int y) {
            this.x = x;
            this.y = y;
        }
    }
}

使用例:

<nu.wen.android.layout.KeyValueLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/example_string_long"
        android:textStyle="bold" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/example_string_short" />
</nu.wen.android.layout.KeyValueLayout>

android - レイアウト オーバーフロー コンポーネント

3 に答える 3

Related

Reference

android - レイアウトオーバーフローコンポーネント