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

时间:2015-10-05 23:04:05

标签: java android xml android-linearlayout android-drawable

我是JAVA和Android开发的新手。

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

据我所知,linearlayout不支持drawables,遗憾的是这段代码对我不起作用:

<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中使用linearlayout。你能告诉我如何实现这个目标吗?

谢谢!

2 个答案:

答案 0 :(得分:1)

我之前做过这个。让我查看我的代码,看看我是否还有它。

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

enter image description here

我使用带有纯白色背景的TextView作为按钮。我相信你也可以使用drawable作为背景。无论如何,看看我做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>

答案 1 :(得分:0)

您可以将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>

还有两件事

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

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

阅读Android Developer API Guides上的布局。