360手机卫士界面布局学习过程续(一)

首先总结一下昨天做的界面。


把两个主要布局做出来,之后还会再继续优化。


1、最上面的边距还要继续调整,右边的“网页”、“亿”还要再继续调整。

2、背景颜色(绿色),按钮的颜色,细线的颜色,都要继续调整。

3、“立即优化”按钮处的细节待完善。

4、下面按钮都有一个点击事件,但是我目前用的全部都是线性布局,我要考虑下之后要不要换成GridView来做。


先上图:

技术分享

cygn.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
     >
    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="6.5"
        android:orientation="vertical"
        android:background="#00ff00"
        >
        <LinearLayout 
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:orientation="horizontal"
            >
            <RelativeLayout 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal"
                >
                <LinearLayout 
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal"
                    android:gravity="center_horizontal"
                    >
                <ImageView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/privacy_password_pro_logo"
                    />
                <TextView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="360卫士"
                    android:textSize="20sp"
                    />
                </LinearLayout>
            <ImageButton 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/st_icon_wifi_exam"
                android:layout_alignParentRight="true"
                android:layout_alignParentEnd="true"
                />
            </RelativeLayout>
        </LinearLayout>
        <LinearLayout 
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="6"
            android:gravity="center"
            >
            <Button 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="立即优化"
                />
        </LinearLayout>
        
        </LinearLayout>
    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="5.5"
        android:orientation="vertical"
        >
        <LinearLayout 
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:orientation="horizontal"
            >
            <LinearLayout 
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="match_parent"
                android:orientation="horizontal"
                android:gravity="center"
                >
                <ImageView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/exam_frequently_used_tools_icon_clean"
                    />
                <TextView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="清理加速"
                    android:textSize="12sp"
                    />
            </LinearLayout>
            <View 
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:background="#110000"
                />
            <LinearLayout 
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="match_parent"
                android:orientation="horizontal"
                android:gravity="center"
                >
                <ImageView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/exam_frequently_used_tools_icon_net_traffic"
                    />
                <TextView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="花费流量"
                    android:textSize="12sp"
                    />
            </LinearLayout>
        </LinearLayout>
        <View 
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="#110000"
                />
        <LinearLayout 
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:orientation="horizontal"
            >
<LinearLayout 
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="match_parent"
                android:orientation="horizontal"
                android:gravity="center"
                >
               <ImageView 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/exam_frequently_used_tools_icon_block_anoy"
                    />
                <TextView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="骚扰拦截"
                    android:textSize="12sp"
                    />
            </LinearLayout>
            <View 
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:background="#110000"
                />
            <LinearLayout 
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="match_parent"
                android:orientation="horizontal"
                android:gravity="center"
                >
                <ImageView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/exam_frequently_used_tools_icon_txl"
                    />
                <TextView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="通讯录"
                    android:textSize="12sp"
                    />
            </LinearLayout>
        </LinearLayout>
        <View 
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="#110000"
                />        
        <LinearLayout 
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:orientation="horizontal"
            >
<LinearLayout 
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="match_parent"
                android:orientation="horizontal"
                android:gravity="center"
                >
                <ImageView 
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:background="@drawable/exam_frequently_used_tools_icon_guardpay"
                    />
                <TextView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="支付保镖"
                    android:textSize="12sp"
                    />
            </LinearLayout>
            <View 
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:background="#110000"
                />
            <LinearLayout 
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="match_parent"
                android:orientation="horizontal"
                android:gravity="center"
                >
                <ImageView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                  android:background="@drawable/exam_frequently_used_tools_icon_malware"
                    />
                <TextView 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="手机杀毒"
                    android:textSize="12sp"
                    />
            </LinearLayout>            
        </LinearLayout>
    </LinearLayout>
    

</LinearLayout>


好的,继续优化调整。有看客有哪里可以指点的请不吝赐教。

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。