移动开发技术作业一：android studio开发微信界面
作者：互联网
一、top.xml布局及代码
在layout里新建一个名为top.xml的文件，在布局小组件俩面拖一个LinearLayout，然后在LinearLayout之下拖一个textView进来。代码如下：
<TextView
android:id="@+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="微信"
android:textColor="@color/white"
android:textSize="30dp" />
</LinearLayout>top界面如下：
二、bottom.xml布局及代码
新建一个Layout Resource File，将ConstrainLayout转化为LinearLayout，添加控件LinearLayout，在LinearLayout中添加ImageView、textView，复制四次，设置一系列属性。
代码如下：
<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="87dp"
android:layout_gravity="bottom"
android:background="#000020">
<LinearLayout
android:id="@+id/LinearLayout_wechat"
android:layout_width="match_parent"
android:layout_height="85dp"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:id="@+id/wechat"
android:layout_width="match_parent"
android:layout_height="50dp"
app:srcCompat="@drawable/wechat1" />
<TextView
android:id="@+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="微信"
android:textColor="@color/white"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:id="@+id/LinearLayout_contacts"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:id="@+id/contacts"
android:layout_width="match_parent"
android:layout_height="50dp"
app:srcCompat="@drawable/contacts1" />
<TextView
android:id="@+id/textView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="通讯录"
android:textColor="@color/white"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:id="@+id/LinearLayout_find"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:id="@+id/find"
android:layout_width="match_parent"
android:layout_height="50dp"
app:srcCompat="@drawable/find1" />
<TextView
android:id="@+id/textView4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="发现"
android:textColor="@color/white"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:id="@+id/LinearLayout_me"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:id="@+id/me"
android:layout_width="match_parent"
android:layout_height="50dp"
app:srcCompat="@drawable/me1" />
<TextView
android:id="@+id/textView5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="我"
android:textColor="@color/white"
android:textSize="30sp" />
</LinearLayout>
</LinearLayout>
三、activity_main界面设计
在布局小组件里面想拖一个LinearLayout，在此布局之下拖一个FragmentLayout并将其id改为content，在code中用include引入之前的顶部界面top.xml以及底部界面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"
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"></include>
<FrameLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<include layout="@layout/bottom"></include>
</LinearLayout>
四、四个fragment页面设计
fragment_first.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"
tools:context=".weixinFragment">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="这是微信聊天界面"
android:textSize="40sp" />
</LinearLayout>fragment_second.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"
tools:context=".weixinFragment">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="这是通讯录界面"
android:textSize="40sp" />
</LinearLayout>fragment_third.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"
tools:context=".weixinFragment">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="这是朋友圈界面"
android:textSize="40sp" />
</LinearLayout>fragment_fourth.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"
tools:context=".weixinFragment">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="这是设置界面"
android:textSize="40sp" />
</LinearLayout>运行结果：
五、MainActivity代码
package com.example.myapplication;
import androidx.appcompat.app.AppCompatActivity;
import android.app.Fragment;
import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.LinearLayout;
public class MainActivity extends AppCompatActivity implements View.OnClickListener{
//创建对象
private Fragment weixinFragment=new weixinFragment();
private Fragment contactFragment=new contactFragment();
private Fragment discoverFragment=new discoverFragment();
private Fragment configFragment=new configFragment();
private FragmentManager fragmentManager;
private LinearLayout linearLayout1,linearLayout2,linearLayout3,linearLayout4;
private ImageButton mImgweixin;
private ImageButton mImgcontact;
private ImageButton mImgdiscover;
private ImageButton mImgconfig;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
supportRequestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
linearLayout1=findViewById(R.id.LinearLayout_weixin);
linearLayout2=findViewById(R.id.LinearLayout_contact);
linearLayout3=findViewById(R.id.LinearLayout_discover);
linearLayout4=findViewById(R.id.LinearLayout_config);
mImgweixin = findViewById(R.id.imageButton_weixin);
mImgcontact = findViewById(R.id.imageButton_contact);
mImgdiscover = findViewById(R.id.imageButton_discover);
mImgconfig = findViewById(R.id.imageButton_config);
linearLayout1.setOnClickListener(this);
linearLayout2.setOnClickListener(this);
linearLayout3.setOnClickListener(this);
linearLayout4.setOnClickListener(this);
initFragment();
selectFragment(0);
}
private void initFragment(){
fragmentManager = getFragmentManager();
FragmentTransaction transaction = fragmentManager.beginTransaction();
transaction.add(R.id.id_content,weixinFragment);
transaction.add(R.id.id_content,contactFragment);
transaction.add(R.id.id_content,discoverFragment);
transaction.add(R.id.id_content,configFragment);
transaction.commit();
}
private void hideFragment(FragmentTransaction transaction){
transaction.hide(weixinFragment);
transaction.hide(contactFragment);
transaction.hide(discoverFragment);
transaction.hide(configFragment);
}
@Override
public void onClick(View v) {
resetImgs();
switch (v.getId()){
case R.id.LinearLayout_weixin:
selectFragment(0);
break;
case R.id.LinearLayout_contact:
selectFragment(1);
break;
case R.id.LinearLayout_discover:
selectFragment(2);
break;
case R.id.LinearLayout_config:
selectFragment(3);
break;
default:
break;
}
}
private void selectFragment(int i){
FragmentTransaction transaction=fragmentManager.beginTransaction();
hideFragment(transaction);
switch (i){
case 0:
transaction.show(weixinFragment);
mImgweixin.setImageResource(R.drawable.weixin_pressed);
break;
case 1:
transaction.show(contactFragment);
mImgcontact.setImageResource(R.drawable.contact_pressed);
break;
case 2:
transaction.show(discoverFragment);
mImgdiscover.setImageResource(R.drawable.discover_pressed);
break;
case 3:
transaction.show(configFragment);
mImgconfig.setImageResource(R.drawable.config_pressed);
break;
default:
break;
}
transaction.commit();
}
//提供灰暗图片
private void resetImgs() {
mImgweixin.setImageResource(R.drawable.weixin);
mImgcontact.setImageResource(R.drawable.contact);
mImgdiscover.setImageResource(R.drawable.discover);
mImgconfig.setImageResource(R.drawable.config);
}
}六、gitee仓库链接
gitee 或 https://gitee.com/xu-suzhi/so-dream.git
标签：transaction,微信,private,LinearLayout,开发技术,studio,import,android,id 来源： https://blog.csdn.net/Christgumeng/article/details/120678216