如何调整按钮表以适应所有手机

时间:2018-03-08 17:13:50

标签: android-layout android-studio kotlin

你好我想做一个Tictactoy游戏我的问题是在布局设计中如何制作它当屏幕变大时桌子和里面的按钮变大,当屏幕较小时,桌子和按钮内部成为不仅小于表

有什么方法可以解决这个问题吗?

The Correct one(my sccren)

The wrong one(when i change it to a smaller sccren)

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/darker_gray"
android:orientation="vertical"
tools:context="com.example.pc.tictactoyv1.act11">


<TableLayout
    android:id="@+id/Table"
    android:layout_width="357dp"
    android:layout_height="wrap_content"
    android:layout_marginBottom="8dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.42"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/linearLayout2"
    app:layout_constraintVertical_bias="0.356">


    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center">

        <Button
            android:id="@+id/Btn1"
            android:layout_width="110dp"
            android:layout_height="128dp"
            android:layout_marginRight="5dp"
            android:background="@android:color/background_light"
            android:onClick="SelectBtn"
            android:textSize="40sp"
            tools:ignore="ButtonStyle" />

        <Button
            android:id="@+id/Btn2"
            android:layout_width="110dp"
            android:layout_height="128dp"
            android:background="@android:color/background_light"
            android:onClick="SelectBtn"
            android:textSize="40sp"
            android:textStyle="bold" />

        <Button
            android:id="@+id/Btn3"
            android:layout_width="110dp"
            android:layout_height="128dp"
            android:layout_marginLeft="5dp"
            android:background="@android:color/background_light"
            android:onClick="SelectBtn"
            android:textSize="40sp" />
        android:textSize="24sp" />

    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:weightSum="3">

        <Button
            android:id="@+id/Btn4"
            android:layout_width="90dp"
            android:layout_height="128dp"
            android:layout_marginRight="5dp"
            android:background="@android:color/background_light"
            android:onClick="SelectBtn"
            android:textSize="40sp" />

        <Button
            android:id="@+id/Btn5"
            android:layout_width="110dp"
            android:layout_height="128dp"
            android:background="@android:color/background_light"
            android:onClick="SelectBtn"
            android:textSize="40sp" />

        <Button
            android:id="@+id/Btn6"
            android:layout_width="110dp"
            android:layout_height="128dp"
            android:layout_marginLeft="5dp"
            android:background="@android:color/background_light"
            android:onClick="SelectBtn"
            android:textSize="40sp" />

    </TableRow>

</TableLayout>

1 个答案:

答案 0 :(得分:0)

您有几种选择:

  • ConstraintLayout指导百分比
  • 嵌套垂直和水平LinearLayouts,重量
  • 创建CustomView来处理onMeasure
  • 中的尺寸
  • ImageViews,背景为白色,设置为fitXYadjustViewBounds = true

这些只是我想到的一些选项,还有更多。选择最适合您需求的产品。对于初学者来说,使用ConstraintLayout的方式可能最简单。

我仍然不知道你想要什么,但我添加了一个使用ConstraintLayout和链均匀扩展的示例。同时结帐constraintDimensionRatio whick使一切正常。您可能想要结帐Constraint Layout How To

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/darker_gray"
android:orientation="vertical">


<LinearLayout
    android:id="@+id/linearLayout2"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:orientation="horizontal">

</LinearLayout>

<android.support.constraint.ConstraintLayout
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintDimensionRatio="1:1"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@id/linearLayout2">

    <Button
        android:id="@+id/Btn4"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@android:color/background_light"
        android:onClick="SelectBtn"
        android:textSize="40sp"
        app:layout_constraintBottom_toTopOf="@+id/Btn7"
        app:layout_constraintEnd_toStartOf="@+id/Btn5"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/Btn1" />

    <Button
        android:id="@+id/Btn9"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@android:color/background_light"
        android:onClick="SelectBtn"
        android:textSize="40sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/Btn8"
        app:layout_constraintTop_toBottomOf="@+id/Btn6" />

    <Button
        android:id="@+id/Btn2"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@android:color/background_light"
        android:onClick="SelectBtn"
        android:textSize="40sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toTopOf="@+id/Btn5"
        app:layout_constraintEnd_toStartOf="@+id/Btn3"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/Btn1"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/Btn1"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@android:color/background_light"
        android:onClick="SelectBtn"
        android:textSize="40sp"
        app:layout_constraintBottom_toTopOf="@+id/Btn4"
        app:layout_constraintEnd_toStartOf="@+id/Btn2"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:ignore="ButtonStyle" />

    <Button
        android:id="@+id/Btn6"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@android:color/background_light"
        android:onClick="SelectBtn"
        android:textSize="40sp"
        app:layout_constraintBottom_toTopOf="@+id/Btn9"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/Btn5"
        app:layout_constraintTop_toBottomOf="@+id/Btn3" />

    <Button
        android:id="@+id/Btn5"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@android:color/background_light"
        android:onClick="SelectBtn"
        android:textSize="40sp"
        app:layout_constraintBottom_toTopOf="@+id/Btn8"
        app:layout_constraintEnd_toStartOf="@+id/Btn6"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/Btn4"
        app:layout_constraintTop_toBottomOf="@+id/Btn2" />

    <Button
        android:id="@+id/Btn7"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@android:color/background_light"
        android:onClick="SelectBtn"
        android:textSize="40sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/Btn8"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/Btn4" />

    <Button
        android:id="@+id/Btn8"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@android:color/background_light"
        android:onClick="SelectBtn"
        android:textSize="40sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/Btn9"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/Btn7"
        app:layout_constraintTop_toBottomOf="@+id/Btn5" />

    <Button
        android:id="@+id/Btn3"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:background="@android:color/background_light"
        android:onClick="SelectBtn"
        android:textSize="40sp"
        app:layout_constraintBottom_toTopOf="@+id/Btn6"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/Btn2"
        app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>