相对于父视图定位子视图

Question

我需要实现一个看起来像这样的视图

难点在于文本视图的大小和字体大小需要适应父视图的宽度和高度。这是我尝试过的，结果是

xml文件：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:layout_width="200dp"
tools:layout_height="100dp"
android:orientation="vertical">

<BuySellView
    android:id="@+id/tradeNow_layoutSell"
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:background="@color/gray_light_light">

    <LinearLayout
        android:id="@+id/smallPart1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="top|right"
        android:orientation="horizontal">

        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="center_vertical">

            <ImageView
                android:id="@+id/greenArrowSellImg"
                android:layout_width="10dp"
                android:layout_height="10dp"
                android:src="@drawable/green_arrow"
                android:visibility="invisible"
                tools:visibility="visible" />

            <ImageView
                android:id="@+id/redArrowSellImg"
                android:layout_width="10dp"
                android:layout_height="10dp"
                android:src="@drawable/red_arrow"
                android:visibility="invisible"
                tools:visibility="visible" />
        </RelativeLayout>

        <TextView
            android:id="@+id/smallPart1Txt"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="top|right"
            android:layout_gravity="center_vertical"
            android:maxLines="1"
            android:text="@string/misc_blank"
            android:textColor="@android:color/black"
            tools:text="10,015." />
    </LinearLayout>


    <TextView
        android:id="@+id/largePart"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:maxLines="1"
        android:text="@string/misc_blank"
        android:textColor="@android:color/black"
        tools:text="46"
        android:gravity="center"
        tools:textColor="@color/red_sell" />


    <TextView
        android:id="@+id/smallPart2"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:maxLines="1"
        android:text="@string/misc_blank"
        android:textColor="@android:color/black"
        android:gravity="left|center_vertical"
        tools:text="8"
        tools:textColor="@color/red_sell" />


    <TextView
        android:id="@+id/trdLbl"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:background="@drawable/rounded_corner_sell"
        android:text="@string/CommonCapitalSell"
        android:textColor="@color/white" />


</BuySellView>

</LinearLayout>

自定义视图：

public class BuySellView extends ViewGroup {

private final Rect mTmpChildRect = new Rect();

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

public BuySellView(Context context, AttributeSet attrs) {
    super(context, attrs);
}

public BuySellView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
}

@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
    int width = getMeasuredWidth();
    int height = getMeasuredHeight();

    int t = 10;
    int b = 10 + height / 3 * 2;

    LinearLayout smallPart1 = (LinearLayout) findViewById(R.id.smallPart1);
    smallPart1.layout(0, height / 3, width / 2, b);
    smallPart1.setGravity(Gravity.RIGHT);
    TextView smallPart1Txt = (TextView) smallPart1.findViewById(R.id.smallPart1Txt);
    smallPart1Txt.setTextSize(height / 4 / 2);

    TextView largePart = (TextView) findViewById(R.id.largePart);
    largePart.setTextSize(height / 3);
    largePart.layout(width / 2, 10, b - t + width / 2, b);

    TextView smallPart2 = (TextView) findViewById(R.id.smallPart2);
    smallPart2.layout(b - t + width / 2, t, width, height / 2);
    smallPart2.setTextSize(height / 4 / 2);

    TextView tradeLbl = (TextView) findViewById(R.id.trdLbl);
    tradeLbl.layout(width / 2 - width / 3 / 2, height / 4 * 3 + 10, width / 2 + width / 3 / 2, height / 4 * 4 + 10);
    tradeLbl.setGravity(Gravity.CENTER);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    LinearLayout smallPart1 = (LinearLayout) findViewById(R.id.smallPart1);
    TextView largePart = (TextView) findViewById(R.id.largePart);
    TextView smallPart2 = (TextView) findViewById(R.id.smallPart2);
    TextView tradeLbl = (TextView) findViewById(R.id.trdLbl);

    smallPart1.measure(Math.max(smallPart1.getMeasuredWidth(), widthMeasureSpec / 8 * 3), heightMeasureSpec / 4);
    largePart.measure(heightMeasureSpec / 4 * 2, heightMeasureSpec / 4 * 2);
    smallPart2.measure(Math.max(smallPart2.getMeasuredWidth(), widthMeasureSpec / 8), smallPart2.getMeasuredHeight());
    tradeLbl.measure(widthMeasureSpec / 3, heightMeasureSpec / 4);

    setMeasuredDimension(widthMeasureSpec, heightMeasureSpec);
}

@Override
public boolean shouldDelayChildPressedState() {
    return false;
}


}

Answer 1

试试这个 XML：

   <RelativeLayout
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/small"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="0.87"
            android:textSize="25sp"
            android:layout_alignBottom="@+id/large"
            android:paddingBottom="8dp"
            android:fontFamily="sans-serif-light"
            />
        <TextView
            android:id="@+id/large"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@+id/small"
            android:text="46"
            android:textSize="58sp"
            android:textColor="#00DC00"
            android:fontFamily="sans-serif-light"

            />
        <TextView
            android:id="@+id/up"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="9"
            android:textSize="24sp"
            android:layout_alignTop="@+id/large"
            android:layout_toRightOf="@+id/large"
            android:textColor="#00DC00"
            android:fontFamily="sans-serif-light"

            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="30dp"
            android:background="#FF4848"
            android:layout_below="@+id/large"
            android:layout_alignRight="@+id/large"
            android:text="Sell USD"
            android:padding="5dp"
            android:textColor="#fff"
            android:textSize="12sp"
            />
    </RelativeLayout>

您可以通过 java 代码根据字符数或文本宽度更改 textSize。