2022寒假家庭记账本开发记录03

本篇是2022寒假家庭记账本开发记录03，本篇通过B站up主——写BUG的狐狸，来学习制作简约家庭记账本。如下是我今日的开发进程：

　　今天我绘制了记账本程序中的收支界面每一项与头布局绘制：

　　首先展示其最终效果图：

　　

 

 　　这里我们用到的是相对布局RelativeLayout，这其中一共包含了八个TextView和一个ImageView。这里我将所有的支出和收入的用text先写成了￥0，后续会进行改动，今天做的只是界面的绘制。

　　其完整代码如下：

　　

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:background="@color/grey_f3f3f3">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        android:padding="20dp">
        <TextView
            android:id="@+id/item_mainlv_top_tv1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/month_out"/>
        <TextView
            android:id="@+id/item_mainlv_top_tv_out"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="￥ 0"
            android:layout_below="@id/item_mainlv_top_tv1"
            android:textSize="26sp"
            android:textStyle="bold"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"
            android:textColor="@color/black" />

        <ImageView
            android:id="@+id/iteam_mainlv_top_iv_hide"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignTop="@id/item_mainlv_top_tv_out"
            android:layout_alignParentRight="true"
            android:src="@mipmap/ih_show" />
        <TextView
            android:id="@+id/item_mainlv_top_tv2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/month_in"
            android:layout_below="@id/item_mainlv_top_tv_out"/>
        <TextView
            android:id="@+id/item_mainlv_top_tv_in"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/black"
            android:text="￥ 0"
            android:layout_below="@id/item_mainlv_top_tv_out"
            android:layout_toRightOf="@id/item_mainlv_top_tv2"
            android:layout_marginLeft="5dp"/>
        <TextView
            android:id="@+id/item_mainlv_top_tv_budget"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="￥ 0"
            android:textColor="@color/black"
            android:layout_alignParentRight="true"
            android:layout_alignBottom="@id/item_mainlv_top_tv2"
            android:layout_marginLeft="5dp"/>
        <TextView
            android:id="@+id/item_mainlv_top_tv3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/budget"
            android:layout_toLeftOf="@id/item_mainlv_top_tv_budget"
            android:layout_alignBottom="@id/item_mainlv_top_tv2"/>
        <TextView
            android:id="@+id/item_mainlv_top_tv4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableLeft="@mipmap/ih_biaoge"
            android:layout_below="@id/item_mainlv_top_tv2"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="20dp"
            android:text="@string/see_excel"
            android:textColor="@color/green_006400"
            android:drawablePadding="10dp"/>
    </RelativeLayout>

    <TextView
        android:id="@+id/item_mainlv_top_tv_day"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="今日支出 ￥0 今日收入 ￥0"
        android:textStyle="bold"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="175dp" />
</androidx.constraintlayout.widget.ConstraintLayout>