网格布局元素以匹配父级大小

时间:2016-08-05 12:23:12

标签: android xamarin

我正在尝试使文本输入组件与屏幕大小相匹配。 例如,这就是我希望它的样子。 This

然而,如果屏幕的大小更大,这就是我得到的。 This

所以,这是我的代码。

 <GridLayout
    android:layout_below="@+id/TopBarLayout"
    android:layout_above="@+id/BottomBarLayout"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerVertical="true"
    android:gravity="center"
    android:padding="30dp"
    android:id="@+id/PatientLayout"
    android:rowCount="6"
    android:columnCount="1">
    <EditText
        style="@style/Editor"
        android:layout_width="match_parent"
        android:id="@+id/PatientFirstNameEditText"
        android:hint="@string/FirstNameHint"
        android:layout_row="0"
        android:layout_column="0"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp" />
    <EditText
        style="@style/Editor"
        android:layout_width="match_parent"
        android:id="@+id/PatientLastNameEditText"
        android:hint="@string/LastNameHint"
        android:layout_row="1"
        android:layout_column="0"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp" />
    <EditText
        style="@style/Editor"
        android:layout_width="match_parent"
        android:id="@+id/PatientMiddleNameEditText"
        android:hint="@string/MiddleNameHint"
        android:layout_row="2"
        android:layout_column="0"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp" />
    <LinearLayout
        android:id="@+id/TopBarLayout"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:orientation="horizontal"
        android:layout_weight="100"
        android:background="#e8e8f5"
        android:layout_row="3"
        android:layout_column="0"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp">
        <EditText
            android:inputType="date"
            style="@style/Editor"
            android:id="@+id/DateOfBirthEditText"
            android:layout_weight="90"
            android:layout_width="0dp" />
        <ImageButton
            android:src="@drawable/calendar"
            android:layout_height="match_parent"
            android:layout_width="0dp"
            android:layout_weight="10"
            android:id="@+id/ShowDatePickerButton"
            android:background="@android:color/transparent"
            android:layout_marginTop="5.0dp"
            android:layout_marginBottom="5.0dp" />
    </LinearLayout>
    <EditText
        style="@style/Editor"
        android:layout_width="match_parent"
        android:id="@+id/PatientSocialSecurityNumberEditText"
        android:hint="@string/SocialSecurityNumberHint"
        android:layout_row="4"
        android:layout_column="0"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp" />
    <RadioGroup
        android:id="@+id/TopBarLayout"
        android:padding="10dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_row="5"
        android:layout_column="0"
        android:orientation="horizontal"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp">
        <RadioButton
            android:text="@string/Male"
            android:padding="10dp"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:id="@+id/PatientMaleRadioButton"
            android:checked="true" />
        <RadioButton
            android:text="@string/Female"
            android:padding="10dp"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:id="@+id/PatientFemaleRadioButton" />
    </RadioGroup>
</GridLayout>

我设置了边距,以便与5英寸的屏幕相匹配。 我希望组件能够适应屏幕的大小。因此,例如,如果屏幕很小,文本也应该按比例缩小。 我希望从gridlayout获得与C#winform的网格面板相同的结果。 谢谢!

1 个答案:

答案 0 :(得分:1)

由于您要构建的所有内容都位于网格的一列中,因此您可以在外部和内部EditTexts上使用垂直线性布局,并为两个单选按钮使用水平线性布局。您可以使用android:layout_weight将元素设置为页面的百分比。您还可以使用android:layout_margin更具体地更改边距,还有marginTop / Bottom / Right等。希望这会有所帮助。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:orientation="vertical" 
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:background="#000000 ">


   <EditText
       android:layout_width="match_parent"
       android:layout_height="0dp"
       android:layout_weight="0.1"
       android:id="@+id/editText1"
       android:layout_margin="20dp"
       android:background="#ffffff "
       android:layout_gravity="center_horizontal" />

   <EditText
       android:layout_width="match_parent"
       android:layout_height="0dp"
       android:layout_weight="0.1"
       android:id="@+id/editText2"
       android:layout_margin="20dp"
       android:background="#ffffff "
       android:layout_gravity="center_horizontal" />

   <EditText
       android:layout_width="match_parent"
       android:layout_height="0dp"
       android:layout_weight="0.1"
       android:id="@+id/editText3"
       android:layout_margin="20dp"
       android:background="#ffffff "
       android:layout_gravity="center_horizontal" />

   <EditText
       android:layout_width="match_parent"
       android:layout_height="0dp"
       android:layout_weight="0.1"
       android:id="@+id/editText4"
       android:layout_margin="20dp"
       android:background="#ffffff "
       android:layout_gravity="center_horizontal" />

   <EditText
       android:layout_width="match_parent"
       android:layout_height="0dp"
       android:layout_weight="0.1"
       android:id="@+id/editText5"
       android:layout_margin="20dp"
       android:background="#ffffff "
       android:layout_gravity="center_horizontal" />

   <LinearLayout
       android:orientation="horizontal"
       android:layout_width="match_parent"
       android:layout_height="0dp"
       android:layout_weight="0.1"
       android:background="#123123 "
       android:layout_gravity="center_horizontal">

       <RadioButton
           android:layout_width="0dp"
           android:layout_weight=".5"
           android:layout_height="wrap_content"
           android:text="Option 1"
           android:id="@+id/radioButton" />
       <RadioButton
           android:layout_width="0dp"
           android:layout_weight=".5"
           android:layout_height="wrap_content"
           android:text="Option 2"
           android:id="@+id/radioButton2" />

   </LinearLayout>

   <Button
       android:layout_width="wrap_content"
       android:layout_height="0dp"
       android:layout_weight="0.1"
       android:text="New Button"
       android:id="@+id/button"
       android:layout_gravity="center_horizontal" />


</LinearLayout>