移动开发课程-作业1

最新推荐文章于 2022-11-24 17:25:03 发布

qq_51875017

最新推荐文章于 2022-11-24 17:25:03 发布

阅读量469

点赞数

文章标签： android java android studio

本文链接：https://blog.csdn.net/qq_51875017/article/details/127118378

版权

一：设计目标：设计微信界面框架,包含微信，朋友，联系人，设置四个界面。

二：功能说明：可以显示四个界面，并点击相应图标可来回切换。

三：代码解析：

头部代码top.xml

<?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="wrap_content"
    android:background="@color/black"
    >

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center"
        android:text="My WeChat"
        android:textColor="@color/white"
        android:textSize="30sp" />
</LinearLayout>

底部代码bottom.xml

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

    <LinearLayout
        android:id="@+id/tab01"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/tab01_img"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:srcCompat="@drawable/weixin_pressed" />

        <TextView
            android:id="@+id/textView1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="微信" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/tab02"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/tab02_img"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:srcCompat="@drawable/friend_pressed" />

        <TextView
            android:id="@+id/textView2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="朋友" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/tab03"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/tab03_img"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:srcCompat="@drawable/contact_pressed" />

        <TextView
            android:id="@+id/textView3"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="联系人" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/tab04"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/tab04_img"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:srcCompat="@drawable/setting_pressed" />

        <TextView
            android:id="@+id/textView4"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="设置" />
    </LinearLayout>
</LinearLayout>

内容界面，以点中微信图标举例

<?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"
    android:orientation="horizontal"
    tools:context=".weixinFragment">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="50sp"
        android:gravity="center"
        android:text="这是微信界面" />

</LinearLayout>

布局代码，activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <include layout="@layout/top" />

    <FrameLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"></FrameLayout>

    <include layout="@layout/bottom" />
</LinearLayout>

mainactivity 实现点击图标页面的切换

package com.example.myapplication;

import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentTransaction;

import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;


public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private Fragment weixinFragment = new weixinFragment();
    private Fragment friendFragment = new friendFragment();
    private Fragment contactFragment = new contactFragment();
    private Fragment settingFragment = new settingFragment();

    private FragmentManager fm;

    private LinearLayout tab01,tab02,tab03,tab04;
    private ImageView tab01_img;
    private ImageView tab02_img;
    private ImageView tab03_img;
    private ImageView tab04_img;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        weixinFragment = new weixinFragment();
        friendFragment = new friendFragment();
        contactFragment = new contactFragment();
        settingFragment = new settingFragment();

        tab01 = findViewById(R.id.tab01);
        tab02 = findViewById(R.id.tab02);
        tab03 = findViewById(R.id.tab03);
        tab04 = findViewById(R.id.tab04);

        fm = getSupportFragmentManager();

        initialfragment();
        tab01_img = findViewById(R.id.tab01_img);
        tab02_img = findViewById(R.id.tab02_img);
        tab03_img = findViewById(R.id.tab03_img);
        tab04_img = findViewById(R.id.tab04_img);
        tab01.setOnClickListener(this);
        tab02.setOnClickListener(this);
        tab03.setOnClickListener(this);
        tab04.setOnClickListener(this);
    }
    private void initialfragment(){
        FragmentTransaction transaction = fm.beginTransaction();
        transaction.add(androidx.appcompat.R.id.content,weixinFragment);
        transaction.add(androidx.appcompat.R.id.content,friendFragment);
        transaction.add(androidx.appcompat.R.id.content,contactFragment);
        transaction.add(androidx.appcompat.R.id.content,settingFragment);
        Hide(transaction);
        transaction.show(weixinFragment);
        transaction.commit();
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()){
            case R.id.tab01: show(1); reset(); tab01_img.setImageResource(R.drawable.weixin_pressed); break;
            case R.id.tab02: show(2); reset(); tab02_img.setImageResource(R.drawable.friend_pressed); break;
            case R.id.tab03: show(3); reset(); tab03_img.setImageResource(R.drawable.contact_pressed); break;
            case R.id.tab04: show(4); reset(); tab04_img.setImageResource(R.drawable.setting_pressed); break;
            default: break;
        }
    }

    private void show(int i) {
        FragmentTransaction transaction = fm.beginTransaction();
        Hide(transaction);
        switch (i){
            case 1:transaction.show(weixinFragment);break;
            case 2:transaction.show(friendFragment);break;
            case 3:transaction.show(contactFragment);break;
            case 4:transaction.show(settingFragment);break;
            default:break;
        }
        transaction.commit();
    }

    private void Hide(FragmentTransaction transaction) {
        transaction.hide(weixinFragment);
        transaction.hide(friendFragment);
        transaction.hide(contactFragment);
        transaction.hide(settingFragment);
    }

    private void reset(){
        tab01_img.setImageResource(R.drawable.weixin);
        tab02_img.setImageResource(R.drawable.friend);
        tab03_img.setImageResource(R.drawable.contact);
        tab04_img.setImageResource(R.drawable.setting);
    }
}

运行展示：