移动开发课程-作业1

西西弗斯529

已于 2022-09-30 15:40:25 修改

阅读量578

点赞数 2

文章标签： android android studio java

于 2022-09-30 15:38:55 首次发布

本文链接：https://blog.csdn.net/weixin_61822456/article/details/127123867

版权

设计目标:

类微信门户框架设计,使用四个tab页面,框架设计必须使用fragment,activity

功能说明:

写出类似与微信的页面,下方有layou,相当于按钮,在java文件中重写点击方法,实现四种不同功能xml的跳转.

代码解析:

首先看xml 界面

这是buttom界面实现四个按钮,在linerlayout中嵌套imag textview 实现图标,因为有四个图标,所以需要四个linerlayout来是实现.以下时代码与效果图

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="horizontal"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="120dp"
    android:layout_gravity="bottom"
    android:visibility="visible"
    android:baselineAligned="false">

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="196dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            app:srcCompat="@drawable/chat"
            tools:ignore="NestedWeights" />

        <TextView
            android:id="@+id/message"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="@string/liaotian"
            android:textSize="25sp" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="214dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            app:srcCompat="@drawable/connect"
            tools:ignore="NestedWeights" />

        <TextView
            android:id="@+id/contact"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="@string/textview"
            android:textSize="25sp" />
    </LinearLayout>


    <LinearLayout
        android:id="@+id/linearLayout3"
        android:layout_width="191dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/imageView3"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            app:srcCompat="@drawable/find"
            tools:ignore="NestedWeights" />

        <TextView
            android:id="@+id/find"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="@string/textview3"
            android:textSize="25sp" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayout4"
        android:layout_width="181dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/imageView4"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            app:srcCompat="@drawable/me"
            tools:ignore="NestedWeights" />

        <TextView
            android:id="@+id/config"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="@string/textview4"
            android:textSize="25sp" />
    </LinearLayout>

    </LinearLayout>

聊天xml,因为不需要实现具体的界面的xml 所以很简单,使用一个textview 即可,代表chat页面

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/messageview1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="@string/message"
        android:textSize="30sp" />


</LinearLayout>

联系人页面

和chat页面相似

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/messageview2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="@string/connect"
        android:textSize="30sp" />

</LinearLayout>

发现界面设置textview居中即可

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/messageview3"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="@string/find"
        android:textSize="30sp" />

</LinearLayout>

"我的" xml

<?xml version="1.0" encoding="utf-8"?>
<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">

    <TextView
        android:id="@+id/messageview4"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="@string/person"
        android:textSize="30sp" />

</LinearLayout>

最重要的是mainactivy界面,使用一个Linerlayout中放入之前的bottom.xml接可以让按钮界面出现在主界面上,之后只需要实现其他xml出现在这个界面上(与点击动作绑定)就可以实现点击功能.为了实现这个跳转,需要引入一个id_content

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">


    <FrameLayout
        android:id="@+id/id_content"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">
    </FrameLayout>
        <include layout="@layout/layout_bottom"></include>

    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

java代码

这是chat.xml的fragment类,只需要使用inflater将layout_chat.xml转化为一个view对象即可,其他几个代码也相似

package com.example.test01;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;

public class ChatFragment extends Fragment {
    public ChatFragment(){}


    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.layout_chat, container, false);
    }
}

package com.example.test01;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import androidx.fragment.app.Fragment;

public class ConnectFragment extends Fragment {


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {

        return inflater.inflate(R.layout.layout_connect, container, false);
    }

}

package com.example.test01;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;

public class FindFragment extends Fragment {
    public FindFragment(){}


    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.layout_find, container, false);
    }
}

package com.example.test01;

import android.app.Person;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;

public class PersonFragment extends Fragment {
    public PersonFragment(){}

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.layout_me,container,false);
    }
}

最后解释实现点击功能的类

为了实现点击功能,首先就重写oncreate去提交不同的变化.然后向linerlayout中加入监听,让各种layout可以监听到点击动作,再重写点击动作的方法,通过r.id来判断点击的是哪个layout再使用fragment来改变view