ConstraintLayout 中的视图不适合屏幕边界
View in ConstraintLayout does not fit within screen bounds
我正在尝试在一个 ConstraintLayout 中对齐 3 个 TableLayout。我希望带有 MaterialButtons 的 table 具有 1:1 尺寸比,而顶部和开始时的 table 仍然完全保持在屏幕范围内。这是它目前的样子:
这个TableLayout的定义:
<TableLayout
android:id="@+id/play_field_table"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/play_field_row_values_table"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.7">
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.google.android.material.button.MaterialButton style="@style/field_unpainted" />
...
<com.google.android.material.button.MaterialButton style="@style/field_unpainted" />
</TableRow>
...
</TableLayout>
按钮样式定义:
<style name="field_unpainted" parent="Widget.MaterialComponents.Button.OutlinedButton">
<item name="android:layout_margin">0dp</item>
<item name="android:padding">0dp</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_weight">1</item>
<item name="android:insetTop">0dp</item>
<item name="android:insetBottom">0dp</item>
<item name="android:textAlignment">center</item>
<item name="android:textStyle">bold</item>
<item name="android:backgroundTint">#ffffff</item>
<item name="android:strokeColor">#000000</item>
<item name="cornerFamily">cut</item>
<item name="cornerRadius">0dp</item>
</style>
开头TableLayout的定义:
<TableLayout
android:id="@+id/play_field_row_values_table"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginLeft="8dp"
app:layout_constraintBottom_toBottomOf="@+id/play_field_table"
app:layout_constraintEnd_toStartOf="@+id/play_field_table"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/play_field_table">
<TableRow
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="end|center_vertical"
android:text="1 1"
android:textAlignment="gravity"
android:textColor="@color/black" />
</TableRow>
...
</TableLayout>
这是上面TableLayout的定义:
<TableLayout
android:id="@+id/play_field_column_values_table"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="@+id/play_field_table"
app:layout_constraintEnd_toEndOf="@+id/play_field_table"
app:layout_constraintStart_toStartOf="@+id/play_field_table">
<TableRow
android:layout_width="0dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_horizontal|bottom"
android:text="1"
android:textAlignment="gravity"
android:textColor="@color/black" />
...
</TableRow>
...
</TableLayout>
我试过将“id/play_field_table”上的 layout_constraintDimensionRatio 设置为 1:1,但它会伸出屏幕:
还尝试将按钮样式中的 layout_constraintDimensionRatio 设置为 1:1,但是按钮要么不显示,要么与上面的结果相同。
我觉得应该同时为按钮和 table 设置比率,只是想不出正确的组合。有什么建议吗?
我通过为“@+id/play_field_table”TableLayout 设置以下值设法解决了这个问题:
- 将“layout_height”从“wrap_content”更改为“0dp”值
- 已将“layout_constraintDimensionRatio”添加为“1:1”值
- 向 TableLayout 内的 TableRows 添加了值为“1”的“layout_weight”
我正在尝试在一个 ConstraintLayout 中对齐 3 个 TableLayout。我希望带有 MaterialButtons 的 table 具有 1:1 尺寸比,而顶部和开始时的 table 仍然完全保持在屏幕范围内。这是它目前的样子:
这个TableLayout的定义:
<TableLayout
android:id="@+id/play_field_table"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/play_field_row_values_table"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.7">
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.google.android.material.button.MaterialButton style="@style/field_unpainted" />
...
<com.google.android.material.button.MaterialButton style="@style/field_unpainted" />
</TableRow>
...
</TableLayout>
按钮样式定义:
<style name="field_unpainted" parent="Widget.MaterialComponents.Button.OutlinedButton">
<item name="android:layout_margin">0dp</item>
<item name="android:padding">0dp</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_weight">1</item>
<item name="android:insetTop">0dp</item>
<item name="android:insetBottom">0dp</item>
<item name="android:textAlignment">center</item>
<item name="android:textStyle">bold</item>
<item name="android:backgroundTint">#ffffff</item>
<item name="android:strokeColor">#000000</item>
<item name="cornerFamily">cut</item>
<item name="cornerRadius">0dp</item>
</style>
开头TableLayout的定义:
<TableLayout
android:id="@+id/play_field_row_values_table"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginLeft="8dp"
app:layout_constraintBottom_toBottomOf="@+id/play_field_table"
app:layout_constraintEnd_toStartOf="@+id/play_field_table"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/play_field_table">
<TableRow
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="end|center_vertical"
android:text="1 1"
android:textAlignment="gravity"
android:textColor="@color/black" />
</TableRow>
...
</TableLayout>
这是上面TableLayout的定义:
<TableLayout
android:id="@+id/play_field_column_values_table"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="@+id/play_field_table"
app:layout_constraintEnd_toEndOf="@+id/play_field_table"
app:layout_constraintStart_toStartOf="@+id/play_field_table">
<TableRow
android:layout_width="0dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_horizontal|bottom"
android:text="1"
android:textAlignment="gravity"
android:textColor="@color/black" />
...
</TableRow>
...
</TableLayout>
我试过将“id/play_field_table”上的 layout_constraintDimensionRatio 设置为 1:1,但它会伸出屏幕:
还尝试将按钮样式中的 layout_constraintDimensionRatio 设置为 1:1,但是按钮要么不显示,要么与上面的结果相同。 我觉得应该同时为按钮和 table 设置比率,只是想不出正确的组合。有什么建议吗?
我通过为“@+id/play_field_table”TableLayout 设置以下值设法解决了这个问题:
- 将“layout_height”从“wrap_content”更改为“0dp”值
- 已将“layout_constraintDimensionRatio”添加为“1:1”值
- 向 TableLayout 内的 TableRows 添加了值为“1”的“layout_weight”