返回顶部

一缕半夏微光

温柔半两,从容一生

导航

头布局

写完家庭记账本APP后,想写一个简单的头布局,然后就以家庭记账本为模型,写了一个简单的头布局

效果如下:

 

 代码如下:

复制代码
 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:orientation="vertical" android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:background="@color/grey">
 6 
 7     <RelativeLayout
 8         android:layout_width="match_parent"
 9         android:layout_height="wrap_content"
10         android:background="@color/white"
11         android:padding="20dp">
12         <TextView
13             android:id="@+id/top_1"
14             android:layout_width="wrap_content"
15             android:layout_height="wrap_content"
16             android:text="本月支出"/>
17         <TextView
18             android:id="@+id/top_2"
19             android:layout_width="wrap_content"
20             android:layout_height="wrap_content"
21             android:text="¥ 0"
22             android:layout_below="@id/top_1"
23             android:textSize="26sp"
24             android:layout_marginTop="10dp"
25             android:layout_marginBottom="10dp"
26             android:textColor="@color/black"/>
27 
28         <ImageView
29             android:id="@+id/top_hide"
30             android:layout_width="wrap_content"
31             android:layout_height="wrap_content"
32             android:layout_alignParentRight="true"
33             android:src="@mipmap/browse"
34             android:layout_alignTop="@id/top_2"/>
35 
36         <TextView
37             android:id="@+id/top_3"
38             android:layout_width="wrap_content"
39             android:layout_height="wrap_content"
40             android:text="本月收入"
41             android:layout_below="@id/top_2"/>
42 
43         <TextView
44             android:id="@+id/top_4"
45             android:layout_width="wrap_content"
46             android:layout_height="wrap_content"
47             android:textColor="@color/black"
48             android:text="¥ 0"
49             android:layout_below="@id/top_2"
50             android:layout_toRightOf="@id/top_3"
51             android:layout_marginLeft="5dp"/>
52 
53         <TextView
54             android:id="@+id/top_5"
55             android:layout_width="wrap_content"
56             android:layout_height="wrap_content"
57             android:text="¥ 0"
58             android:textColor="@color/black"
59             android:layout_alignParentRight="true"
60             android:layout_alignBottom="@id/top_3"
61             android:layout_marginLeft="5dp"/>
62 
63         <TextView
64             android:id="@+id/top_6"
65             android:layout_width="wrap_content"
66             android:layout_height="wrap_content"
67             android:text="预算剩余"
68             android:layout_toLeftOf="@id/top_5"
69             android:layout_alignBottom="@id/top_3"/>
70 
71         <TextView
72             android:id="@+id/top_7"
73             android:layout_width="wrap_content"
74             android:layout_height="wrap_content"
75             android:drawableLeft="@mipmap/analyse"
76             android:layout_below="@id/top_3"
77             android:layout_centerHorizontal="true"
78             android:layout_marginTop="20dp"
79             android:text="查看图表分析"
80             android:textColor="@color/pink"
81             android:drawablePadding="10dp"/>
82     </RelativeLayout>
83     <TextView
84         android:id="@+id/top_day"
85         android:layout_width="match_parent"
86         android:layout_height="wrap_content"
87         android:text="今日支出 ¥0   今日收入 ¥0"
88         android:textStyle="bold"
89         android:layout_marginTop="20dp"
90         android:layout_marginBottom="10dp"/>
91 </LinearLayout>
复制代码

 

posted on 2021-02-23 23:23  一缕半夏微光  阅读(81)  评论(0编辑  收藏  举报