wx页面设计

最新推荐文章于 2024-08-20 13:04:52 发布

陈强ya

最新推荐文章于 2024-08-20 13:04:52 发布

阅读量663

点赞数

文章标签： python 机器学习 pandas

本文链接：https://blog.csdn.net/m0_67586252/article/details/127128951

版权

本文档介绍了如何设计一个类似微信的门户页面，要求使用fragment和activity，不使用UNIAPP。设计包括顶部布局、中间内容展示区和底部状态栏。在中间部分，采用FrameLayout作为界面切换容器。底部状态栏由四个线性布局构成，每个包含图标和文本。代码解析部分提供了XML布局和Java实现的概览，并附有运行截图和源码仓库链接。

摘要由CSDN通过智能技术生成

文章目录

一.设计目标
二.功能说明
三.代码解析
- 1.xlm
- 2.java
四.运行展示截图
五.源码仓库地址

一、设计目标

请大家根据课程教学内容完成类微信的门户页面框架设计，APP最少必须包含4个tab页面。框架设计需要使用fragment，activity，不得使用UNIAPP技术进行开发（H5或者小程序）；

二、功能说明

1.顶部布局我使用了一个LinearLayout作为主控件附加一个textView作为文本显示

2.中间部分主要是用来展示进入微信后的初始界面和点击四个底部选项、所显示的对应内容，先选一个FrameLaout作为中间部分界面的载体，让后把其余5个用来展示界面切换的控件存放到这个主载体中进行集中控制

3.底部状态栏我们要同时展示四个图标和其对应的文本，每一个单独的选择栏之间是呈现纵向分布的，每个状态栏里的图标和文本是呈现横向分布的，先使用一个LinearLaout用来存放四个状态栏，再使用四个LinearLaout分别用来实现四个状态栏具体的展示，然后在四个LinearLaout里各自使用一个ImageView和textView用来显示图标和对应文字。

三，代码解析

1.xlm

中间部分先选一个FrameLaout作为中间部分界面的载体，让后把其余5个用来展示界面切换的控件存放到这个主载体中进行集中控制，这是朋友其余四个与其基本相同。

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
    tools:context=".Fragment_3">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="没有朋友"
        android:textAlignment="center"
        android:textSize="25sp" />

</FrameLayout>

activity_main.xml

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

    <LinearLayout
        android:id="@+id/linearLayout"
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:background="#EDE9E9"
        android:orientation="horizontal"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0">

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

            <ImageView
                android:id="@+id/weixin_chat"
                android:layout_width="85dp"
                android:layout_height="50dp"
                android:layout_marginLeft="7dp"
                android:layout_marginRight="1