如何在 Android Studio 中根据屏幕大小调整按钮大小答案

【问题标题】：How to adjust button size according to screen size in Android Studio如何在 Android Studio 中根据屏幕大小调整按钮大小
【发布时间】：2014-12-07 12:58:39
【问题描述】：

我是 android 开发新手，我正在 android studio 中制作计算器。我的计算器工作正常，但它的布局有问题我将它安装在我的平板电脑上并且按钮非常小，因为我在模拟器上的 Android Studio 中设计它们，按钮大小没有改变，需要帮助以便按钮大小随着屏幕尺寸的变化而增加。

我在 Android Studio 中的计算器设计

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:background="#ff000000">
    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/clear"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginTop="110dp"
        android:background="@drawable/clear_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/plus_minus"
        android:layout_alignBottom="@+id/clear"
        android:layout_toRightOf="@+id/clear"
        android:layout_toEndOf="@+id/clear"
        android:layout_marginLeft="-11dp"
        android:background="@drawable/pm_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/per"
        android:layout_alignBottom="@+id/plus_minus"
        android:layout_toRightOf="@+id/plus_minus"
        android:layout_toEndOf="@+id/plus_minus"
        android:layout_marginLeft="-11dp"
        android:background="@drawable/per_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/div"
        android:layout_alignTop="@+id/per"
        android:layout_toRightOf="@+id/per"
        android:layout_toEndOf="@+id/per"
        android:layout_marginLeft="-11dp"
        android:background="@drawable/div_btn"
        android:layout_alignParentRight="false" />

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="70dp"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:id="@+id/disp"
        android:layout_above="@+id/plus_minus"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:textColor="@android:color/white"
        android:textSize="32sp"
        android:inputType="none"
        android:textStyle="normal"
        android:gravity="right" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/seven"
        android:layout_below="@+id/clear"
        android:layout_toLeftOf="@+id/plus_minus"
        android:layout_toStartOf="@+id/plus_minus"
        android:layout_marginTop="-10dp"
        android:layout_alignParentTop="false"
        android:layout_alignParentLeft="true"
        android:background="@drawable/seven_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/eight"
        android:layout_alignTop="@+id/seven"
        android:layout_alignLeft="@+id/plus_minus"
        android:layout_alignStart="@+id/plus_minus"
        android:background="@drawable/eight_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/nine"
        android:layout_alignBottom="@+id/seven"
        android:layout_alignLeft="@+id/per"
        android:layout_alignStart="@+id/per"
        android:background="@drawable/nine_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/mul"
        android:layout_alignTop="@+id/nine"
        android:layout_alignLeft="@+id/div"
        android:layout_alignStart="@+id/div"
        android:background="@drawable/mul_btn" />

    <Button
        android:layout_width="103dp"
        android:layout_height="90dp"
        android:id="@+id/four"
        android:layout_below="@+id/seven"
        android:layout_alignRight="@+id/seven"
        android:layout_alignEnd="@+id/seven"
        android:layout_marginTop="-10dp"
        android:layout_alignParentLeft="false"
        android:background="@drawable/four_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/five"
        android:layout_alignBottom="@+id/four"
        android:layout_alignLeft="@+id/eight"
        android:layout_alignStart="@+id/eight"
        android:background="@drawable/five_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/six"
        android:layout_alignTop="@+id/five"
        android:layout_alignLeft="@+id/nine"
        android:layout_alignStart="@+id/nine"
        android:background="@drawable/six_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/sub"
        android:layout_toEndOf="@+id/nine"
        android:layout_alignTop="@+id/six"
        android:layout_alignLeft="@+id/mul"
        android:layout_alignStart="@+id/mul"
        android:background="@drawable/min_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/one"
        android:layout_below="@+id/four"
        android:layout_alignLeft="@+id/four"
        android:layout_alignStart="@+id/four"
        android:layout_marginTop="-10dp"
        android:layout_alignParentLeft="false"
        android:background="@drawable/one_btn" />

    <Button
        android:layout_width="203dp"
        android:layout_height="90dp"
        android:id="@+id/zero"
        android:layout_below="@+id/one"
        android:layout_alignLeft="@+id/one"
        android:layout_alignStart="@+id/one"
        android:layout_marginTop="-10dp"
        android:background="@drawable/zero_btn"
        android:layout_alignParentLeft="true"
        android:layout_marginLeft="-7dp" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/two"
        android:layout_above="@+id/zero"
        android:layout_alignLeft="@+id/five"
        android:layout_alignStart="@+id/five"
        android:background="@drawable/two_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/three"
        android:layout_below="@+id/five"
        android:layout_alignLeft="@+id/six"
        android:layout_alignStart="@+id/six"
        android:layout_marginTop="-10dp"
        android:background="@drawable/three_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/add"
        android:layout_toEndOf="@+id/three"
        android:layout_below="@+id/six"
        android:layout_alignLeft="@+id/sub"
        android:layout_alignStart="@+id/sub"
        android:layout_marginTop="-10dp"
        android:background="@drawable/plus_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/dot"
        android:layout_below="@+id/two"
        android:layout_alignRight="@+id/three"
        android:layout_alignEnd="@+id/three"
        android:layout_marginTop="-10dp"
        android:background="@drawable/dot_btn" />

    <Button
        android:layout_width="100dp"
        android:layout_height="90dp"
        android:id="@+id/equ"
        android:layout_toEndOf="@+id/dot"
        android:layout_below="@+id/three"
        android:layout_alignLeft="@+id/add"
        android:layout_alignStart="@+id/add"
        android:layout_marginTop="-10dp"
        android:background="@drawable/equ_btn" />

</RelativeLayout>

【问题讨论】：

它没有改变，因为您将宽度和高度设置为固定值。尝试使用权重
如果您指定 100dp 的宽度，则在任何设备上的结果都应该是大约 0.6 英寸/1.6 厘米宽。如果我有一台平板电脑，我为什么要大按钮？不能简单地将布局放大。

标签： android xml android-layout

【解决方案1】：

您必须使用layout_weight 才能实现您想要的，这将通过将每一行按钮包装在LinearLayout 中来使用，所有LinearLayouts 加上TextView 将被包装在一个中大 LinearLayout 而不是你的 RelativeLayout，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/main_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#ff000000"
    android:orientation="vertical"
    android:weightSum="6" >

    <TextView
        android:id="@+id/disp"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:inputType="none"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textColor="@android:color/white"
        android:textSize="32sp"
        android:textStyle="normal" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal"
        android:weightSum="4" >

        <Button
            android:id="@+id/clear"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/clear_btn" />

        <!-- then the three remaining buttons -->

        <LinearLayout />

        <!-- then the four remaining rows -->


        <!-- in the last row the "0" button will have layout_weight="2" NOT "1" -->
    </LinearLayout>

</LinearLayout>

更新：

使用 ImageButtons 而不是 Buttons 以获得更好的可扩展性，这就是您必须使用它的方式：

    <ImageButton
            android:id="@+id/clear"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/clear_btn"
            android:scaleType="fitCenter" />

    <!-- and so for all Buttons -->

注意这里我们改变了：

1- layout_height ：从 wrap_content 到 match_parent 。

2- background ：删除 drawable(clear_btn) 并使其成为 transparent。

我们补充说：

1- src : 为其分配 drawable(clear_btn)。

2- scaleType ：将其设置为 fitCenter 以使其在所有可用区域中进行缩放，而不会破坏图像的可缩放比。

P.S：如果您希望 Button 获取所有区域天气它是否可扩展，请将 scaleType 从 fitCenter 更改为 fitXY（可能您需要对于“0”按钮）。

【讨论】：

谢谢它帮了大忙 :)
@Muhammad Refaat 我按照你的指导做了（s27.postimg.org/t3g0v1ukz/del_mr.png），但现在出现问题，因为按钮垂直和水平之间有很多间隙，所以我该如何消除间隙:(
@user889030 问题是您使用的是Buttons 而不是ImageButtons，这将使您能够更好地调整视图，因此，我建议您将按钮替换为ImageButtons，我将发布更新，其中包含对按钮的必要更改。
你必须像你写的那样将 Button android:layout_weight="4" 更改为 android:layout_weight="1" ->
@Ingo 是的，没错，可能是打错了，我更正了，谢谢。

【解决方案2】：

如果您想支持多个屏幕，切勿手动拖放和调整视图大小。

您可以同时检查android:layout_weight 属性和LinearLayout

【讨论】：

【解决方案3】：

解决方案 1：请使用 dimens.xml 指定按钮的高度和高度。

对于平板电脑，请创建文件夹 values-sw600dp,values-sw720dp 并将您的 dimens.xml 放入其中。

解决方案 2：

Use linearlayout and layout_weight property.

【讨论】：

【解决方案4】：

<android.support.v7.widget.RecyclerView  
android:id="@+id/sampleRecyclerView"  
android:scrollbars="vertical"  
android:layout_width="fill_parent"  
android:layout_height="fill_parent">

<Button android:id="@+id/sampleButton"
 android:width="0dp"
 android:height="50dp">
</Button>
</android.support.v7.widget.RecyclerView>

我认为这里的重点是线性布局内的<Button> </Button>。

android:width="0dp" // This line changes width as of linear layout.
android:height="50dp">

【讨论】：

【解决方案5】：

在 android 中设置按钮的高度/宽度时，使用固定密度像素值将在所有屏幕上产生精确的尺寸。使用宽度值作为wrap_content、fill_parent、权重等将使按钮看起来根据屏幕密度。

尝试通过此链接一次：- Best Practices for User Interface

【讨论】：