如何处理自定义布局

时间:2015-04-24 14:39:34

标签: android android-layout android-view

我试图创建一个自定义UI元素(图片中的蓝色),它将被放置在常规RelativeLayout内(它将被使用2或3次)。视图必须包含TextViewImageButtons和类似的小部件。 我已阅读自定义ViewsViewGroups,但我不知道要使用哪一个。我应该延长RelativeLayout吗?任何帮助(特别是教程链接)都会有所帮助。 感谢

我想要做的事情的图片;

enter image description here

1 个答案:

答案 0 :(得分:0)

你找不到关于用户界面的好教程,所以我试着为你做 只使用xml! 我只是编辑填充和layout_weight ..和layout_gravity ..这些是你需要的重要事情 电话屏幕(4")

enter image description here 平板电脑屏幕(10.1")

enter image description here

这是布局:

<?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:paddingLeft="20dp"
    android:paddingTop="20dp"
    android:paddingRight="20dp">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:background="@drawable/bbbb"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:text="textView"
                android:id="@+id/textView30"
                android:layout_gravity="center"
                android:background="@drawable/btn_back"
                android:textColor="#ffffffff"
                android:paddingRight="25dp"
                android:paddingLeft="25dp" />
        </LinearLayout>

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_marginTop="20dp">

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button"
                android:id="@+id/button5"
                android:layout_weight="1"
                android:background="@drawable/btn_back"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:textColor="#ffffffff" />

            <Button
                android:background="@drawable/btn_back"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button"
                android:id="@+id/button6"
                android:layout_weight="1"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:textColor="#ffffffff" />

            <Button
                android:background="@drawable/btn_back"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button"
                android:id="@+id/button7"
                android:layout_weight="1"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:textColor="#ffffffff" />
        </LinearLayout>

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent">

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:layout_margin="10dp"
                android:background="@drawable/btn_back">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAppearance="?android:attr/textAppearanceSmall"
                    android:text="textView"
                    android:id="@+id/textView"
                    android:layout_centerHorizontal="true"
                    android:textColor="#ffffffff" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAppearance="?android:attr/textAppearanceMedium"
                    android:text="Text"
                    android:id="@+id/textView28"
                    android:layout_below="@+id/textView"
                    android:background="#ffffffff"
                    android:layout_marginBottom="5dp"
                    android:padding="10dp"
                    android:layout_alignParentRight="true"
                    android:layout_alignParentEnd="true"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentStart="true"
                    android:gravity="center" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:layout_margin="10dp"
                android:background="@drawable/btn_back">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAppearance="?android:attr/textAppearanceSmall"
                    android:text="textView"
                    android:id="@+id/textView27"
                    android:layout_centerHorizontal="true"
                    android:textColor="#ffffffff" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAppearance="?android:attr/textAppearanceMedium"
                    android:text="Text"
                    android:id="@+id/textView29"
                    android:layout_below="@+id/textView27"
                    android:background="#ffffffff"
                    android:layout_marginBottom="5dp"
                    android:padding="10dp"
                    android:layout_alignParentRight="true"
                    android:layout_alignParentEnd="true"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentStart="true"
                    android:gravity="center" />
            </RelativeLayout>
        </LinearLayout>

    </LinearLayout>
</RelativeLayout>

这是drawablr / btn_back.xml

 <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" >
        <shape>
            <solid
                android:color="#0067EB"/>
            <stroke
                android:width="1dp"
                android:color="#00000000" />
            <corners
                android:radius="8dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
    <item>
        <shape>
            <solid
                android:color="#0061C2"
                android:angle="270" />
            <stroke
                android:width="1dp"
                android:color="#00000000" />
            <corners
                android:radius="8dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
</selector>

这是drawable / bbbb.xml

      <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
    <corners
        android:radius="14dp"
        />
    <gradient
        android:angle="45"
        android:startColor="#FFF"
        android:endColor="#eee"
        android:type="linear"
        />
    <padding
        android:left="0dp"
        android:top="0dp"
        android:right="0dp"
        android:bottom="0dp"
        />
    <size
        android:width="270dp"
        android:height="60dp"
        />
    <stroke
        android:width="3dp"
        android:color="#307FE6"
        />
</shape>