微信页面的简单模拟

本篇博客用于记录移动互联网开发的第一次作业完成过程中所遇到的问题以及解决方案

一、任务需求

本次作业要求对微信界面实现简单模拟，具体需求如下：

模拟微信界面布局 ，做到美观大方；
实现内部数据联动，即当点击不同按钮后展示不同的内容。
掌握监听的基本使用方法。

二、遇到的问题与解决方案

1. AndroidX引发出的错误

授课内容是基于Android展开，而AndroidX是对 android.support.xxx 包的整理后产物，其中的一些方法和授课过程中使用的基于Android中的方法不能通用，这为后续工作的开展带来了一些不便。
对此，网上现存的解决方案有很多，如：

在SDK Manager中取消勾选Android Q（29）；
在gradle.properties中将下述代码改为false后重新编译

android.useAndroidX=true
android.enableJetifier=true

重新安装AS

对于以上几种方法我都有所尝试，但是因为AS版本不同的原因，在重新安装了若干次AS之后，这些方法也都没有真正解决AS自动创建AndroidX项目这个问题。对此，我的解决方法是手动导入需要的包，如：import android.app.Activity;。
对于多个不同的java文件，导入的包需要保持一致性。当我在MainActivity.java中使用：import android.app.Fragment;后，由于引用的另一个weixinFragment.java中使用了AndroidX的包：import androidx.fragment.app.Fragment;导致标红。

2. ImageButtion运行后无法显示图片

这个地方其实算是自己手误导致的，在对应的xml中应该使用

android:src="@drawable/tab_weixin_pressed"

我一开始写成了：

app:srcCompat="@drawable/tab_weixin_pressed"

再这里要再次提醒自己，一定要看清楚想好之后在敲键盘！！！XD

3. 内部数据联动，以及相应图标的颜色变化

解决思路: 对ImageButton所在的LinearLayout进行编号，通过点击不同编号的LinearLayout区域来分别切换至不同的内容。对于button，一开始默认焦点在编号为1的button处，此时该button对应图表颜色为绿色，当点击至其他编号位置时，先将所有的图片变为灰色，然后再将选中区域图片变为绿色。

    private void setSelect(int i) {FragmentTransaction transaction = fm.beginTransaction();hideFragment(transaction);switch (i) {case 0:Log.d("setSelect","1");transaction.show(mTab01);mImgWeixin.setImageResource(R.drawable.tab_weixin_pressed);break;case 1:transaction.show(mTab02);mImgFrd.setImageResource(R.drawable.tab_find_frd_pressed);break;case 2:transaction.show(mTab03);mImgAddress.setImageResource(R.drawable.tab_address_pressed);break;case 3:transaction.show(mTab04);mImgSettings.setImageResource(R.drawable.tab_settings_pressed);break;default:break;}transaction.commit();}private void resetImg() {mImgWeixin.setImageResource(R.drawable.tab_weixin_normal);mImgFrd.setImageResource(R.drawable.tab_find_frd_normal);mImgAddress.setImageResource(R.drawable.tab_address_normal);mImgSettings.setImageResource(R.drawable.tab_settings_normal);}@Overridepublic void onClick(View v) {Log.d("onClick","1");resetImg();switch (v.getId()) {case R.id.id_tab_weixin:Log.d("onClick","2");setSelect(0);break;case R.id.id_tab_frd:setSelect(1);break;case R.id.id_tab_contact:setSelect(2);break;case R.id.id_tab_settings:setSelect(3);break;}}

三、部分代码及最终效果展示

由于上一部分已经展示了部分代码，这里只给出了前端页面的部分代码展示

<?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"android:orientation="vertical"><include layout="@layout/top"/><FrameLayoutandroid:id="@+id/id_content"android:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1"></FrameLayout><include layout="@layout/bottom"/>
</LinearLayout>

最终效果如图：

本文对应源代码

Android Studio开发（一）模拟微信页面相关推荐

Android Studio开发（四）SQLite数据库的DAO标准CRUD操作模拟微信通讯录
Android Studio开发(四)SQLite数据库的DAO标准CRUD操作模拟微信通讯录 Android Studio开发(四)SQLite数据库的DAO标准CRUD操作模拟微信通讯录一.任务 ...
Android Studio 开发–微信APP门户界面设计
Android Studio 开发–微信APP门户界面设计本次Github代码仓库 --crcr1013/MyWechat 文章目录 Android Studio 开发--微信APP门户界面设计前 ...
android studio微信界面设计,android studio开发微信界面
android studio开发微信界面 android studio开发微信界面功能说明:主要是做微信的简单的聊天界面,利用Fragment,进行微信界面的跳转项目代码: 源代码地址 MainA ...
android studio 微信登录界面,如何使用Android Studio开发用户登录界面
满意答案 zhou9081 2016.05.21 采纳率:51% 等级:7 已帮助:411人如何使用Android Studio开发用户登录界面,具体解决方案如下: 解决方案1: <:t ...
《Android Studio开发实战从零基础到App上线》源码运行问题解答
本书提供了所有章节的完整源码下载,自上市以来陆续收到读者的意见反馈,现将与源码有关的问题汇总归类如下,方便更多的朋友解决源码运行过程中发现的问题: 一.打开本书源码时,出现"Plugin w ...
Android Studio开发（六）短距离无线通信——蓝牙通信
Android Studio开发(六)短距离无线通信--蓝牙通信 Android Studio开发(六)蓝牙通信一.任务需求二.短距离无线通信技术(Short-Distance Wirleless ...
Android Studio开发——蓝牙聊天功能
Android Studio开发--蓝牙聊天功能蓝牙工作流程功能要求实现要点声明蓝牙权限添加程序运行的状态描述文本及配色代码布局文件蓝牙会话的服务组件ChatService Activi ...
《Android Studio开发实战从零基础到App上线》第一版的资源下载和内容勘误
资源下载下面是<Android Studio开发实战从零基础到App上线>(第一版)一书用到的工具和代码资源: 1.本书使用的Android Studio版本为2.2.3,因为Andr ...
flutter图标按钮_Flutter开发第一个项目android studio 开发工具的使用说明
Flutter开发第一个项目android studio 开发工具的使用说明做个自我介绍自我介绍还是有必要介绍一下的,毕竟这是网络里,你看不到我,我看不到你,只能通过文字来传递信息,本人做技术8年 ...

Android Studio开发（一）模拟微信页面