根据屏幕Android Studio在GridLayout中设置按钮的宽度和高度

时间:2018-12-19 02:04:00

标签: android xml android-studio android-gridlayout

我正在尝试制作一个计算器应用程序,并且我在一个片段中使用网格视图来显示数字,但是我无法设法使按钮充满他们应该在其他设备中尝试的部分。

<android.support.v7.widget.GridLayout
    android:layout_width="match_parent"
    android:layout_height="419dp"

    android:layout_margin="0dp"
    android:padding="0dp"
    app:columnCount="4"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintWidth_percent="100"
    app:rowCount="4"
    app:useDefaultMargins="false">

    <Button
        android:id="@+id/but_7"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="AddBut"
        android:text="7"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_8"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:lineSpacingExtra="0sp"
        android:onClick="AddBut"
        android:text="8"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_9"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="AddBut"
        android:text="9"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_div"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="ButOP"
        android:text="÷"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_4"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="AddBut"
        android:text="4"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_5"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="AddBut"
        android:text="5"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_6"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="AddBut"
        android:text="6"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_mult"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="ButOP"
        android:text="x"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_1"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="AddBut"
        android:text="1"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_2"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="AddBut"
        android:text="2"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_3"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="AddBut"
        android:text="3"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_min"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="ButOP"
        android:text="-"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_0"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="AddBut"
        android:text="0"
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_dot"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="ButOP"
        android:text="."
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_eq"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="ButOP"
        android:text="="
        android:textSize="36sp" />

    <Button
        android:id="@+id/but_plus"
        android:layout_width="96sp"
        android:layout_height="96sp"
        android:layout_marginLeft="-3sp"
        android:layout_marginTop="-5sp"
        android:layout_marginRight="-3sp"
        android:layout_marginBottom="-5sp"
        android:onClick="ButOP"
        android:text="+"
        android:textSize="36sp" />
</android.support.v7.widget.GridLayout>

这是我目前的布局,它适合我的手机,但在nexus 5X模拟器中留有边距。我尝试使用rowWeight和columnWeight,但是我不知道它是否只是可以正常工作,或者我是否做错了什么。还尝试了在dp和sp之间进行切换...我尝试了很多搜索,以基于秘密或类似方法使用百分比,但是没有任何效果(或者我无法使其正常工作...)

我想要的是在任何设备上填充屏幕宽度的按钮,并使高度与每个按钮的宽度相同,例如height = btn.getwidth();。我不知道那是否可行。

我知道我听起来像个极端,但是我正在学习,所以请不要生我的气。

3 个答案:

答案 0 :(得分:1)

感谢GianhTran的评论,在developer.android.com/training/constraint-layout中,我找到了一个计算器布局,并对其进行调整以管理所需的内容。

首先:使用约束布局,并将按钮的每一侧链接到它们旁边的按钮和页边距。 然后对宽度和高度都使用match_constraint。 并且如果我想使按钮始终保持正方形:将布局嵌套在另一个约束布局中,并向嵌套布局(而不是按钮)应用尺寸比“ 1:1”。

最终的xml是这样的:

<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:orientation="vertical">

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:background="@android:color/holo_orange_dark"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintDimensionRatio="1:1"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.0">

    <Button
        android:id="@+id/button6"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="1dp"

        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="3"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button12"
        app:layout_constraintLeft_toRightOf="@+id/button13"
        app:layout_constraintRight_toLeftOf="@+id/button23"
        app:layout_constraintTop_toBottomOf="@+id/button9"
        tools:text="6" />

    <Button
        android:id="@+id/button26"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="subtract"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/button25"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button24" />

    <Button
        android:id="@+id/button8"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="5"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button13"
        app:layout_constraintLeft_toRightOf="@+id/button7"
        app:layout_constraintRight_toLeftOf="@+id/button9"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="8" />

    <Button
        android:id="@+id/button10"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"

        android:text="7"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/button14"
        app:layout_constraintRight_toLeftOf="@+id/button25"
        app:layout_constraintTop_toBottomOf="@+id/button11"
        tools:text="0" />

    <Button
        android:id="@+id/button12"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="9"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button25"
        app:layout_constraintLeft_toRightOf="@+id/button11"
        app:layout_constraintRight_toLeftOf="@+id/button24"
        app:layout_constraintTop_toBottomOf="@+id/button6"
        tools:text="3" />

    <Button
        android:id="@+id/button24"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="add"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button26"
        app:layout_constraintLeft_toRightOf="@+id/button12"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button23" />

    <Button
        android:id="@+id/button5"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="2"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button4"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/button13"
        app:layout_constraintTop_toBottomOf="@+id/button7"
        tools:text="4" />

    <Button
        android:id="@+id/button14"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="dot"

        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/button10"
        app:layout_constraintTop_toBottomOf="@+id/button4" />

    <Button
        android:id="@+id/button9"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"

        android:text="6"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button6"
        app:layout_constraintLeft_toRightOf="@+id/button8"
        app:layout_constraintRight_toLeftOf="@+id/button22"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="9" />

    <Button
        android:id="@+id/button11"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="8"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button10"
        app:layout_constraintLeft_toRightOf="@+id/button4"
        app:layout_constraintRight_toLeftOf="@+id/button12"
        app:layout_constraintTop_toBottomOf="@+id/button13"
        tools:text="2" />

    <Button
        android:id="@+id/button13"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="0"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button11"
        app:layout_constraintLeft_toRightOf="@+id/button5"
        app:layout_constraintRight_toLeftOf="@+id/button6"
        app:layout_constraintTop_toBottomOf="@+id/button8"
        tools:text="5" />

    <Button
        android:id="@+id/button23"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="multiply"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button24"
        app:layout_constraintLeft_toRightOf="@+id/button6"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button22" />

    <Button
        android:id="@+id/button22"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="divide"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button23"
        app:layout_constraintLeft_toRightOf="@+id/button9"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/button25"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="1dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"

        android:text="equals"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/button10"
        app:layout_constraintRight_toLeftOf="@+id/button26"
        app:layout_constraintTop_toBottomOf="@+id/button12" />

    <Button
        android:id="@+id/button4"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"

        android:layout_marginRight="1dp"

        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="1"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button14"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/button11"
        app:layout_constraintTop_toBottomOf="@+id/button5"
        tools:text="1" />

    <Button
        android:id="@+id/button7"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginRight="1dp"
        android:layout_marginTop="1dp"
        android:background="@drawable/ripple2"
        android:text="4"
        android:textColor="@android:color/holo_orange_dark"
        app:layout_constraintBottom_toTopOf="@+id/button5"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/button8"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="7" />
</android.support.constraint.ConstraintLayout>

感谢GianhTran

答案 1 :(得分:0)

按钮本身具有'minHeight'和'minWidth'属性。 也许您可以尝试

android:minHeight="0dp"
android:minWidth="0dp"

在每个按钮中删除每个按钮的默认边距。

答案 2 :(得分:0)

您可以在运行时通过使用layout.getViewTreeObserver();来获取屏幕尺寸,然后在侦听器中可以使用int width = layout.getMeasuredWidth();来获取宽度,并使用int height = layout.getMeasuredHeight();来获取高度。因此,现在您可以在应用程序加载(OnCreate)时调整Button的大小。您可以在此处查看此链接以获取更多信息,这里=> Get height and width of a layout programmatically

使用约束布局的另一种解决方案。它非常有用且灵活,我保证您会喜欢它。请让我知道它是否有效