Android手机UI设计---”知乎“界面外观模仿篇（三）---ScrollView的使用

这是接着上一篇博客的Android手机UI设计—“知乎”模仿的界面设计三，而且为下一篇博客在做准备。

任务目标：较为完善的模仿“知乎”的 设置 界面。

PS：这个我是用Android Studio2.3做的。由于自己初学Android，想模仿一个页面来练手。于是，这个是模仿的“知乎”手机APP外观的界面。

要实现的功能：
“知乎”的“更多”设置界面布局实现

这个是使用ScrollView的方式来实现的，主要用到的布局方式有LinearLayout和include以及RelativeLayout。

参照地址：http://blog.csdn.net/c19344881x/article/details/43056365

界面运行效果图

源码：

MoreFragment.Java的代码：完成“更多”设置界面的实现。很简单！

package com.example.lenovo.design;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ListView;
import android.widget.SimpleAdapter;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

/**
 * Created by lenovo on 2017/3/29.
 */

public class MoreFragment extends Fragment {
   

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View moreLayout = inflater.inflate(R.layout.more_layout,
                container, false);

        return moreLayout;
    }

}

界面布局的具体实现

这次主要讲布局的代码

more_layout.xml的代码：“更多”设置界面的主布局

<?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="match_parent">
    <RelativeLayout
        android:id="@+id/widget1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#ffffff">
            <include
                android:visibility="visible"
                layout="@layout/more_titile_layout"
                android:id="@+id/include">

            </include>

        <ScrollView
            android:id="@+id/scrollView1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/include"
            android:scrollbars="none">
        <include
            android:visibility="visible"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            layout="@layout/layout">
        </include>

      </ScrollView>

    </RelativeLayout>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:orientation="vertical">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:src="@drawable/zhy5"/>

    </LinearLayout>

</RelativeLayout>

more_titile_layout.xml的代码：和上一篇的letter_titile_layout.xml相同。被包含的内容。

<?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="56dp"
    android:background="@color/royalblue"
    android:orientation="horizontal">