我正在設計一個標題行,其中專案標題在中間,左側是狀態描述,右側是到期日期描述。標題應該始終居中并擴大寬度,直到它進入任一側視圖,此時它應該變成橢圓形。我無法弄清楚如何保持標題視圖居中,同時允許兩個側視圖具有不同的大小,同時在側視圖只有兩個或三個字符的情況下嘗試顯示盡可能多的文本, 或多達 20 個。
這不是讓中心視圖填充空間的基本問題。這些案例將概述我的額外要求,這使它變得更加棘手。
我嘗試了兩種主要方法:
- 線性布局
我從水平線性布局開始。第一個和第三個 TextView 的寬度為 WRAP_CONTENT,而中心標題視圖的寬度為 0dp,權重為 1,允許它填充行的中間部分。這里的問題是第一個和第三個視圖的寬度與 WRAP_CONTENT 不同,因此標題視圖會以一種或另一種方式移動。在這里查看標題如何向左移動到較小的文本:

之后,我為 LinearLayout 分配了 20 的 weightSum,第一個和第三個視圖的權重為 4,中間視圖的權重為 12,所有 3 個的寬度為 0dp。這效果更好,但不允許最終視圖中的文本較長,即使行中有足夠的空間可以擴展視圖:

將視圖更改為使用 WRAP_CONTENT 的 layout_weight 和寬度也不起作用。

- 約束布局
我也將行切換到 ConstraintLayout 來嘗試。我從使用 WRAP_CONTENT 作為寬度的結束視圖和使用 0dp 的標題視圖開始這條路線。標題視圖的開始鏈接到第一個視圖的結束,結束鏈接到最后一個視圖的開始。當然,這會將標題視圖轉向更短的結尾文本。將端視圖更改為 0dp 的寬度會產生相同的結果。

從這里我走得更近了。我將中間視圖的開始和結束鏈接到父 LinearLayout 以便它拉伸整個寬度。然后我將第一個視圖的結束鏈接到中間視圖的開始,最后一個視圖的開始鏈接到中間視圖的結束,并將它們的寬度都設定為 0dp。通過將中間視圖的寬度設定為 0dp 并添加 64dp 的 marginStart 和 marginEnd,我為顯示第一個和最后一個視圖留出了一些空間。盡管如此,這就像帶有權重的 LinearLayout 解決方案,因為中間視圖每一側的間隙都是固定的 64dp 大小,并且不允許擴展。

我最后的努力是如此接近!將中間視圖的寬度更改為 WRAP_CONTENT,并將開始和結束都鏈接到父級,允許結束視圖具有相等的寬度,并完全展開。也就是說,直到標題視圖變得很長。寬度為 WRAP_CONTENT 時,中間視圖會以非常長的文本將端視圖推離螢屏,即使在端視圖上設定了 min_width 也是如此。

將端視圖更改為寬度為 WRAP_CONTENT 也不起作用。

我想要完成的最像最后一次嘗試,只是我希望中間視圖停止擴展并變成橢圓形,而不是把端視圖推出。還有其他想法可以嘗試嗎?
uj5u.com熱心網友回復:
問題是,如果您希望第一個和第三個視圖的寬度相等,我認為僅使用標準 xml 布局是不可能的,因為一旦調整了視圖的大小就為時已晚,如果沒有額外的代碼就不會再次調整它的大小。
像 TableLayout 這樣的東西有額外的代碼來調整所有行的大小以匹配,一個是單獨調整它們的大小。
但是你可以自己編程
例如
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
LinearLayout mainLayout = findViewById(R.id.content);
// Wait until mainLayout has it's size calculated
ViewTreeObserver.OnGlobalLayoutListener mGlobalLayoutListener = new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
// Don't listen anymore
mainLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this);
TextView col1 = new TextView(getApplicationContext());
TextView col2 = new TextView(getApplicationContext());
TextView col3 = new TextView(getApplicationContext());
col1.setText("Much Long");
col1.setBackgroundColor(Color.CYAN);
col3.setText("Long");
col3.setBackgroundColor(Color.CYAN);
col3.setGravity(Gravity.RIGHT);
col2.setText("Really Really Really Really Really Really Really Really Really Long");
col2.setGravity(Gravity.CENTER_HORIZONTAL);
col2.setSingleLine(true);
// Set it to have Ellipsizes if too long
TextUtils.TruncateAt truncate = TextUtils.TruncateAt.END;
col2.setEllipsize(truncate);
int measureSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); // As big as the view wants to be
// Measure all the views
col1.measure(measureSpec, measureSpec);
col2.measure(measureSpec, measureSpec);
col3.measure(measureSpec, measureSpec);
// work which side is bigger
int maxWidth = Math.max(col1.getMeasuredWidth(), col3.getMeasuredWidth());
int parentWidth = mainLayout.getWidth();
// Probably should have some checks to make sure centre width does not go negative
int centreWidth = parentWidth - (2 * maxWidth);
col1.setWidth(maxWidth);
col2.setWidth(centreWidth);
col3.setWidth(maxWidth);
mainLayout.addView(col1);
mainLayout.addView(col2);
mainLayout.addView(col3);
}
};
mainLayout.getViewTreeObserver().addOnGlobalLayoutListener(mGlobalLayoutListener);
}
}
產生一些例子

中間列的中心始終在螢屏的中心
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/528316.html
