Android:如何使用 XML 绘制 8 个相等的矩形以适合屏幕宽度

Android: How to draw 8 equal rectangles to fit screen width with XML

我是 JAVA 和 Android 开发的新手。

基本上我想画 8 个相等的矩形(键盘键)以适应 100% 的宽度。

据我所知,linearlayout 不支持可绘制对象,很遗憾,这段代码对我不起作用:

<LinearLayout
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:weightSum="2">
    <View
        android:id="@+id/keyboardKey1"
        android:background="@drawable/keyboard_key_white"
        android:weight="1"
        android:layout_width="0dip"
        android:layout_height="200dp"
        android:layout_alignTop="@+id/keyboardKeyC"
        android:layout_toRightOf="@+id/keyboardKeyA" />
    <View
        android:id="@+id/keyboardKey2"
        android:background="@drawable/keyboard_key_white"
        android:weight="1"
        android:layout_width="0dip"
        android:layout_height="200dp"
        android:layout_alignTop="@+id/keyboardKeyC"
        android:layout_toRightOf="@+id/keyboardKeyA" />
</LinearLayout>

这里还有keyboard_key_while.xml的内容:

<?xml version="1.0" encoding="UTF-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#fff" />
    <stroke
        android:width="1dp"
        android:color="#000" />
</shape>

据我所知,我也不能反其道而行之,在可绘制对象内部使用线性布局 XML。你能给我一些建议吗?

谢谢!

我以前做过。让我检查一下我的代码,看看我是否还有它。

我找到了。我创建的布局用于计算器。我希望按钮根据屏幕尺寸缩放。

我为按钮使用了具有纯白色背景的 TextView。我相信您也可以使用可绘制对象作为背景。无论如何,看看我做 LinearLayouts 的方式。

代码

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:orientation="horizontal"
    android:layout_marginTop="10dp"
    android:layout_marginRight="10dp"
    android:layout_marginBottom="5dp"
    android:layout_marginLeft="10dp"
    android:background="#ffffffff"
    >

    <TextView
      android:id="@+id/name"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_marginTop="0dp"
      android:layout_marginRight="5dp"
      android:layout_marginBottom="0dp"
      android:layout_marginLeft="0dp"
      android:layout_weight="3"
      android:background="#ffffff"
      android:text="Food"
      android:gravity="center|right"
      android:paddingRight="0dp"
      android:singleLine="true" 
      android:textSize="27sp"
      android:textStyle="bold"
      android:onClick="onViewClick"  
      />

    <RelativeLayout
      android:id="@+id/more"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_marginTop="0dp"
      android:layout_marginRight="0dp"
      android:layout_marginBottom="0dp"
      android:layout_marginLeft="5dp"
      android:layout_weight="1"
      android:background="@drawable/layer_list_arrow_dn"  
      android:gravity="center"
      android:singleLine="true"    
      android:onClick="onViewClick"  
      />

  </LinearLayout>

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:orientation="horizontal"
    android:layout_marginTop="5dp"
    android:layout_marginRight="10dp"
    android:layout_marginBottom="5dp"
    android:layout_marginLeft="10dp"
    android:background="#ffffffff"
    >

    <TextView
      android:id="@+id/amount"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_marginTop="0dp"
      android:layout_marginRight="5dp"
      android:layout_marginBottom="0dp"
      android:layout_marginLeft="0dp"
      android:layout_weight="3"
      android:background="#ffffff"
      android:text="0.00"
      android:gravity="center|right"
      android:paddingRight="0dp"
      android:singleLine="true"    
      android:textSize="27sp"
      android:textStyle="bold"  
      android:onClick="onViewClick"  
      />

    <RelativeLayout
      android:id="@+id/clear"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_marginTop="0dp"
      android:layout_marginRight="0dp"
      android:layout_marginBottom="0dp"
      android:layout_marginLeft="5dp"
      android:layout_weight="1"
      android:background="@drawable/layer_list_clear"
      android:gravity="center"
      android:singleLine="true"    
      android:onClick="onViewClick"  
      />

  </LinearLayout>

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="4"
    android:orientation="horizontal"
    android:layout_marginTop="5dp"
    android:layout_marginRight="10dp"
    android:layout_marginBottom="10dp"
    android:layout_marginLeft="10dp"
    android:background="#00fcb514"
    >

    <LinearLayout
      android:layout_width="wrap_content"
      android:layout_height="match_parent"
      android:layout_weight="1"
      android:orientation="vertical"
      android:layout_marginLeft="0dp"
      android:layout_marginRight="5dp"
      android:background="#00333333"
      >

      <TextView
        android:id="@+id/b00"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="0dp"
        android:layout_marginBottom="5dp"
        android:background="@drawable/ripple_holo_blue_bright"
        android:text="7"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b01"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:background="#ffffff"
        android:text="4"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b02"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:background="#ffffff"
        android:text="1"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b03"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="0dp"
        android:background="#ffffff"
        android:text=""
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

    </LinearLayout>

    <LinearLayout
      android:layout_width="wrap_content"
      android:layout_height="match_parent"
      android:layout_weight="1"
      android:orientation="vertical"
      android:layout_marginLeft="5dp"
      android:layout_marginRight="5dp"
      android:background="#00666666"
      >

      <TextView
        android:id="@+id/b10"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="0dp"
        android:layout_marginBottom="5dp"
        android:background="#ffffff"
        android:text="8"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b11"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:background="#ffffff"
        android:text="5"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:background="#ffffff"
        android:text="2"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b13"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="0dp"
        android:background="#ffffff"
        android:text="0"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

    </LinearLayout>

    <LinearLayout
      android:layout_width="wrap_content"
      android:layout_height="match_parent"
      android:layout_weight="1"
      android:orientation="vertical"
      android:layout_marginLeft="5dp"
      android:layout_marginRight="5dp"
      android:background="#00999999"
      >

      <TextView
        android:id="@+id/b20"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="0dp"
        android:layout_marginBottom="5dp"
        android:background="#ffffff"
        android:text="9"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b21"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:background="#ffffff"
        android:text="6"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b22"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:background="#ffffff"
        android:text="3"
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b23"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="0dp"
        android:background="#ffffff"
        android:text="."
        android:gravity="center"
        android:textSize="27sp"
        android:textStyle="bold"
        android:onClick="onViewClick"  
        />

    </LinearLayout>

    <LinearLayout
      android:layout_width="wrap_content"
      android:layout_height="match_parent"
      android:layout_weight="1"
      android:orientation="vertical"
      android:layout_marginLeft="5dp"
      android:layout_marginRight="0dp"
      android:background="#00cccccc"
      >

      <TextView
        android:id="@+id/b30"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="0dp"
        android:layout_marginBottom="5dp"
        android:textSize="27sp"
        android:textStyle="bold"
        android:background="@drawable/layer_list_arrow_up"  
        android:onClick="onViewClick"  
        />

      <TextView
        android:id="@+id/b31"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/layer_list_arrow_dn"  
        android:layout_marginTop="5dp"
        android:layout_marginBottom="0dp"
        android:textSize="27sp"
        android:textStyle="bold"  
        android:onClick="onViewClick"  
        />

    </LinearLayout>

  </LinearLayout>

</LinearLayout>

您可以将 LinearLayout 设置为水平方向,并将每个视图设置为 layout_weight 和零 layout_width。你快到了,但你必须使用 layout_weight 而不是 weight

这显示两个键占据了屏幕的宽度。如果您在其中放置 8 个视图,它会相应地缩放。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <View
        android:id="@+id/keyboardKey1"
        android:layout_width="0dip"
        android:layout_height="200dp"
        android:layout_weight="1"
        android:background="@drawable/keyboard_key_white" />

    <View
        android:id="@+id/keyboardKey2"
        android:layout_width="0dip"
        android:layout_height="200dp"
        android:layout_weight="1"
        android:background="@drawable/keyboard_key_white" />

</LinearLayout>

还有两件事

在您的示例中,您在键盘视图(layout_alignToplayout_toRightOf)中使用了 RelativeLayout 布局参数。但是,键盘视图由 LinearLayout 托管,因此会被忽略,因此可以将它们排除在外。

另一种方法是使用 GridLayout,您可以在其中指定所需的列数和行数。在 GridLayout 中,您可以使用 layout_columnlayout_row 为每个子视图指定希望它显示在哪一列和哪一行。

阅读 Android Developer API Guides 上的布局。