Android 布局 天气预报demo

Android 布局 天气预报demo

代码部分

layout_title

<?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="wrap_content">


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="大连"
        android:textColor="@color/charaColor"
        android:textSize="20dp"
        android:layout_centerInParent="true"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="16:03"
        android:textColor="@color/charaColor"
        android:textSize="20dp"
        android:layout_alignParentRight="true"
        android:layout_marginTop="20dp"/>
        </RelativeLayout>

layout_now

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="15dp">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@color/charaColor"
        android:text="14℃"
        android:textSize="60dp"
        android:layout_gravity="right"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@color/charaColor"
        android:text="多云"
        android:textSize="20dp"
        android:layout_gravity="right"
        />
</LinearLayout>

layout_aqi (运用权重将布局等分)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/shape_layout"
    android:layout_margin="15dp">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="空气指数"
        android:textSize="20dp"
        android:textColor="@color/charaColor"
        android:layout_marginTop="15dp"
        android:layout_marginLeft="15dp"
        />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_margin="15dp">
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical"
            android:gravity="center">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="61"
                android:textColor="@color/charaColor"
                android:textSize="60dp"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="AQI指数"
                android:textColor="@color/charaColor"
                android:textSize="20dp"
                />
        </LinearLayout>
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical"
            android:gravity="center">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="27"
                android:textColor="@color/charaColor"
                android:textSize="60dp"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="PM2.5指数"
                android:textColor="@color/charaColor"
                android:textSize="20dp"
                />
        </LinearLayout>
    </LinearLayout>
</LinearLayout>

layou_forecast

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="15dp"
    android:background="@drawable/shape_layout">
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="预报"
    android:textSize="20dp"
    android:layout_marginTop="15dp"
    android:layout_marginLeft="15dp"
    android:textColor="@color/charaColor" />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_marginTop="15dp"
        android:layout_marginBottom="15dp"
        android:gravity="center"
        >
        <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="2019 10 16      晴天      9℃ ~~ 16℃"
        android:textSize="18dp"
        android:textColor="@color/charaColor"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="2019 10 17      多云      8℃ ~~ 16℃"
            android:textSize="18dp"
            android:textColor="@color/charaColor"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="2019 10 18      晴天      9℃ ~~ 19℃"
            android:textSize="18dp"
            android:textColor="@color/charaColor"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="2019 10 19      多云      5℃ ~~ 18℃"
            android:textSize="18dp"
            android:textColor="@color/charaColor"/>
    </LinearLayout>
</LinearLayout>

layout_suggestion

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/shape_layout"
    android:layout_margin="15dp"
    >
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="建议"
    android:textSize="20dp"
    android:textColor="@color/charaColor"
    android:layout_marginTop="15dp"
    android:layout_marginLeft="15dp"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hyhyhyhyhyhxxxxxxxxxxxxxxxxxxxxxxxxxssssssssssssssssx"
        android:textSize="15dp"
        android:textColor="@color/charaColor"
        android:layout_margin="15dp"
        android:maxLines="2"
        android:ellipsize="end"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ssscsvdsvsdxxxxxxxxxxxxxxxxxxxxxxxxxssssssssssssssssx"
        android:textSize="15dp"
        android:textColor="@color/charaColor"
        android:layout_margin="15dp"
        android:maxLines="2"
        android:ellipsize="end"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ddfbdfbdfbfdxxxxxxxxxxxxxxxxxxxxxxxxxssssssssssssssssx"
        android:textSize="15dp"
        android:textColor="@color/charaColor"
        android:layout_margin="15dp"
        android:maxLines="2"
        android:ellipsize="end"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="fvdfbdfbdfxxxxxxxxxxxxxxxxxxxxxxxxxssssssssssssssssx"
        android:textSize="15dp"
        android:textColor="@color/charaColor"
        android:layout_margin="15dp"
        android:maxLines="2"
        android:ellipsize="end"
        />
</LinearLayout>

layout_main（最后加上滚动）

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@mipmap/pp"
>
    <include layout="@layout/layout_title"/>
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <include layout="@layout/layout_now"/>
            <include layout="@layout/layout_forecast"/>
            <include layout="@layout/layout_aqi"/>
            <include layout="@layout/layout_suggestion" />
        </LinearLayout>
    </ScrollView>
</LinearLayout>