2021-01-09

android首页制作
分析
1.根据页面分析使用几个部分组成
在这里插入图片描述

分析好页面,制作首页布局代码如下

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"

    android:radius="20dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"

    android:background="@drawable/QQ图片20201020111229"
    android:orientation="vertical"
    >

    <LinearLayout
        android:layout_width="359dp"
        android:layout_height="wrap_content"

        android:layout_gravity="center_horizontal"
        android:layout_marginTop="170dp"

        android:gravity="center"
        android:orientation="vertical">
        <!--头部标题部分-->
        <LinearLayout
            android:layout_width="350dp"

            android:layout_height="match_parent"
            android:background="@drawable/index_shape"
            android:gravity="center">

            <LinearLayout
                android:layout_width="138dp"
                android:layout_height="match_parent"
                android:layout_marginTop="2dp"
                android:background="@drawable/title_shape"
                android:gravity="center">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="37dp"
                    android:layout_marginTop="5dp"
                    android:layout_marginRight="10dp"
                    android:text="部队管理"
                    android:textColor="#ffffff"
                    android:textSize="18dp" />
            </LinearLayout>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="   干部申请   "
                android:textColor="#0a0943"
                android:textSize="18dp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="10dp"
                android:text="|"
                android:textSize="20dp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="20dp"
                android:text="灭火救援"
                android:textColor="#0a0943"
                android:textSize="18dp" />
        </LinearLayout>
        <!--小图标部分-->
        <ImageView
            android:layout_width="25dp"
            android:layout_height="10dp"
            android:layout_gravity="center"
            android:layout_marginLeft="-100dp"
            android:background="@drawable/biao" />
        <!--    网格布局部分-->
        <GridLayout
            android:layout_width="350dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginTop="10dp"
            android:background="@color/cardview_dark_background"
            android:columnCount="3"
            android:rowCount="4">

            <LinearLayout
                android:layout_width="215dp"
                android:layout_height="84dp"
                android:layout_columnSpan="2"
                android:layout_gravity="fill"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo1" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="0"
                android:layout_column="2"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"

                    android:background="@drawable/btn_logo2" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="1"
                android:layout_column="0"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo3" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="1"
                android:layout_column="1"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo4" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="1"
                android:layout_column="2"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo5" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="2"
                android:layout_column="0"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo6" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="2"
                android:layout_column="1"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo7" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="2"
                android:layout_column="2"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo8" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="3"
                android:layout_column="0"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo9" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="3"
                android:layout_column="1"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo10" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="107dp"
                android:layout_height="84dp"
                android:layout_row="3"
                android:layout_column="2"

                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"

                android:layout_marginBottom="5dp"
                android:background="@color/white"
                android:gravity="center">

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:background="@drawable/btn_logo11" />
            </LinearLayout>

        </GridLayout>
    </LinearLayout>
    <!--底部部分-->
    <!-- 框线-->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
    </LinearLayout>
    <View
        android:layout_height="1dp"
        android:layout_width="wrap_content"
        android:background="#444444"
        android:layout_marginBottom="-15dp"
        android:layout_marginTop="10dp"
        />
<!--    框线结束-->

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="55dp"

        android:layout_marginTop="15dp"
        android:background="#ffffff"

        android:gravity="center">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/logo2" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"

            android:layout_marginRight="30dp"
            android:text="首页"
            android:textSize="18dp" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/logo2" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"

            android:layout_marginRight="30dp"
            android:text="消息"
            android:textSize="18dp" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/logo3" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"

            android:layout_marginRight="10dp"
            android:text="个人中心"
            android:textSize="16dp" />
    </LinearLayout>

</LinearLayout>

利用shap.xml在center.xml中添加android:background="@drawable/shape",使得文本框变为圆角的。
在设计界面展示图如下
在这里插入图片描述

最后运行出现问题
在这里插入图片描述
遇到的是版本问题,需要更新gradle就行了。

猜你喜欢

转载自blog.csdn.net/Nflyingj/article/details/112392193