Introducción a la función de ingeniería
Abra la aplicación, la primera es una interfaz de pantalla de inicio (comúnmente vista en pequeños anuncios al abrir la aplicación), establezca el tiempo en 2 segundos y luego ingrese a la interfaz de inicio de sesión. En la interfaz de inicio de sesión, puede ingresar la contraseña en el medio y hacer clic en el botón de inicio de sesión para ingresar a la interfaz de WeChat.
La interfaz de WeChat se compone de 4 fragmentos, el primer fragmento se usa para mostrar la información recibida recientemente, el segundo fragmento se usa para mostrar la libreta de direcciones, que se hace con ListView; el tercero es la interfaz de descubrimiento de WeChat, y el El segundo fragmento se usa para mostrar la libreta de direcciones. Cuatro fragmentos se usan para mostrar la información del usuario.
En la interfaz de mensajes, puede ingresar a la interfaz de chat haciendo clic en un contacto, enviar un mensaje a la otra parte y hacer clic en el botón de retorno en la parte superior izquierda para salir de la interfaz de chat.
El tercer fragmento es la interfaz de descubrimiento. Debido a que hay muchas cosas, ScrollView se usa para hacer un diseño desplazable. Al hacer clic en el círculo superior de la barra de amigos, puede ingresar a la interfaz del círculo de amigos para ver el círculo de amigos, y haga clic en el botón de retorno en la esquina superior izquierda para volver a la página de descubrimiento.
código detallado
El código involucra algunas imágenes. Si necesita archivos de imágenes, puede descargarlos desde el archivo del proyecto al final del artículo. La ruta de las imágenes es WechatApplication\app\src\main\res\mipmap-mdpi
Además, en la operación real, el programa puede estar marcado con una línea roja en este orden en el medio del programa. No se preocupe, el código probablemente desaparecerá después de escribirlo, o no podrá continuar en este orden en todo.
actividad de la pantalla de inicio
Primero, creemos una actividad de pantalla de inicio, primero creamos su archivo de diseño.
actividad_splash.xml
Cree un nuevo archivo de diseño en la carpeta de diseño, denominado activity_login
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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=".SplashActivity">
<ImageView
android:id="@+id/tubiao"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@mipmap/tubiao"
android:layout_marginTop="80dp"
android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="微信"
android:layout_below="@+id/tubiao"
android:textSize="50dp"
android:textColor="#000000"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
SplashActividad
El siguiente es su archivo de clase Java, cree una nueva clase Java llamada SplashActivity en el paquete
public class SplashActivity extends AppCompatActivity {
private Handler mHandler = new Handler();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
mHandler.postDelayed(new Runnable() {
@Override
public void run() {
startActivity(new Intent(SplashActivity.this,LoginActivity.class));
}
},2000);
}
}
interfaz de inicio de sesión
actividad_login.xml
Cree un nuevo archivo de diseño en la carpeta de diseño, denominado activity_login
<?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"
android:background="#f2f2f2">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/touxiang"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="@mipmap/touxiang"
android:layout_centerHorizontal="true"
android:layout_marginTop="90dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="所长的肚子"
android:layout_below="@+id/touxiang"
android:layout_centerHorizontal="true"
android:textSize="30dp"
android:textColor="#000000"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="20dp">
<TextView
android:id="@+id/mima"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="密码"
android:textSize="30dp"
android:textColor="#000000"
android:layout_marginTop="5dp"
android:layout_marginLeft="20dp"/>
<EditText
android:id="@+id/edittxt"
android:layout_width="1040dp"
android:layout_height="50dp"
android:layout_marginLeft="20dp"
android:layout_toRightOf="@+id/mima"
android:background="@null"
android:hint="请输入密码" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:id="@+id/line"
android:layout_width="25dp"
android:layout_height="1dp"
android:background="#f2f2f2"/>
<View
android:layout_width="1030dp"
android:layout_height="1dp"
android:background="#60ff0f"
android:layout_toRightOf="@+id/line"/>
<View
android:layout_width="25dp"
android:layout_height="1dp"
android:background="#f2f2f2"
android:layout_alignParentRight="true"/>
</RelativeLayout>
<Button
android:id="@+id/btn_forget_pwd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/btn_login"
android:text="用短信验证码登录"
android:textSize="20dp"
android:textColor="#2999ce"
android:layout_marginLeft="20dp"
android:layout_marginTop="10dp"
android:background="@null"/>
<Button
android:id="@+id/btn_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="登录"
android:textSize="24sp"
android:layout_marginTop="10dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:background="#f4f5f7"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/dongjie"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="紧急冻结"
android:textSize="20dp"
android:textColor="#2999ce"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="@null"/>
<TextView
android:id="@+id/shuxian1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="|"
android:textSize="20dp"
android:layout_toLeftOf="@+id/dongjie"
android:layout_alignParentBottom="true"
android:layout_marginBottom="12dp"/>
<TextView
android:id="@+id/shuxian2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="|"
android:textSize="20dp"
android:layout_toRightOf="@+id/dongjie"
android:layout_alignParentBottom="true"
android:layout_marginBottom="12dp"/>
<Button
android:id="@+id/zhaohui"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="找回密码"
android:textSize="20dp"
android:textColor="#2999ce"
android:layout_alignParentBottom="true"
android:layout_toLeftOf="@+id/shuxian1"
android:background="@null"/>
<Button
android:id="@+id/gengduo"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:text="更多"
android:textSize="20dp"
android:textColor="#2999ce"
android:layout_alignParentBottom="true"
android:layout_toRightOf="@+id/shuxian2"
android:background="@null"
/>
</RelativeLayout>
</LinearLayout>
LoginActivity.java
Cree una nueva clase de Java llamada LoginActivity dentro del paquete
public class LoginActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_login);
Button button = findViewById(R.id.btn_login);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent(LoginActivity.this,MainActivity.class);
startActivity(intent);
}
});
}
}
Interfaz principal
Finalmente llegamos a la interfaz principal, la primera es activity_main
actividad_principal.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">
<!--内容-->
<RelativeLayout
android:id="@+id/container_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
<!--功能菜单-->
<LinearLayout
android:id="@+id/container_menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#f2f2f2"
android:layout_alignParentBottom="true">
<LinearLayout
android:id="@+id/menu_weixin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:layout_weight="1">
<ImageView
android:id="@+id/caidan_weixin"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@mipmap/weixin02"
android:background="@drawable/menu_weixin_icon_selector"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="微信"
android:textColor="#000000"
android:textSize="20dp"/>
</LinearLayout>
<LinearLayout
android:id="@+id/menu_tongxunlu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:layout_weight="1">
<ImageView
android:id="@+id/caidan_tongxun"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="@drawable/menu_tongxunlu_icon_selector"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="通讯录"
android:textColor="#000000"
android:textSize="20sp"/>
</LinearLayout>
<LinearLayout
android:id="@+id/menu_faxian"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:layout_weight="1">
<ImageView
android:id="@+id/caidain_faxian"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="@drawable/menu_faxian_icon_selector"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="发现"
android:textColor="#000000"
android:textSize="20sp"/>
</LinearLayout>
<LinearLayout
android:id="@+id/menu_wode"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:layout_weight="1">
<ImageView
android:id="@+id/caidan_wode"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="@drawable/menu_wode_icon_selector"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我的"
android:textColor="#000000"
android:textSize="20sp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
El primer fragmento, weixin_fragment.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="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="#f2f2f2">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="微信"
android:textColor="#000000"
android:textSize="25dp" />
<Button
android:id="@+id/qita"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@mipmap/qita"
android:layout_alignParentRight="true"
android:layout_marginTop="15dp"
android:layout_marginRight="10dp"/>
<Button
android:id="@+id/sousuo"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginTop="15dp"
android:layout_marginRight="0dp"
android:layout_toLeftOf="@+id/qita"
android:background="@mipmap/sousuo" />
</RelativeLayout>
<ListView
android:id="@+id/weixin_listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:divider="#000000"
android:overScrollMode="never"/>
</LinearLayout>
El segundo fragmento, tongxunlu_fragment.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="match_parent"
android:orientation="vertical"
android:background="#ffffff">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="#f2f2f2">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="通讯录"
android:textColor="#000000"
android:textSize="25dp" />
<Button
android:id="@+id/qita"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@mipmap/qita"
android:layout_alignParentRight="true"
android:layout_marginTop="15dp"
android:layout_marginRight="10dp"/>
<Button
android:id="@+id/sousuo"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginTop="15dp"
android:layout_marginRight="0dp"
android:layout_toLeftOf="@+id/qita"
android:background="@mipmap/sousuo" />
</RelativeLayout>
<ListView
android:id="@+id/txl_listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#000000"
android:overScrollMode="never"
/>
</LinearLayout>
El tercer fragmento, faxian_fragment.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="match_parent"
android:orientation="vertical">
<!--头部-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="#f2f2f2">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="发现"
android:textColor="#000000"
android:textSize="25dp" />
<Button
android:id="@+id/qita"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@mipmap/qita"
android:layout_alignParentRight="true"
android:layout_marginTop="15dp"
android:layout_marginRight="10dp"/>
<Button
android:id="@+id/sousuo"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginTop="15dp"
android:layout_marginRight="0dp"
android:layout_toLeftOf="@+id/qita"
android:background="@mipmap/sousuo" />
</RelativeLayout>
<!--内容-->
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:overScrollMode="never">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:id="@+id/pyquan_click"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/pyquan"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:background="@mipmap/pyquan" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
android:layout_toRightOf="@+id/pyquan"
android:text="朋友圈"
android:textColor="#000000"
android:textSize="20dp" />
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:background="@mipmap/wode_xinxi" />
</RelativeLayout>
<View
android:layout_width="match_parent"
android:layout_height="10dp"
android:background="#e0e0e0"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/shipinghao"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/shipinghao"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/shipinghao"
android:text="视屏号"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
<View
android:layout_width="match_parent"
android:layout_height="10dp"
android:background="#e0e0e0"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/saoysao"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/saoysao"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/saoysao"
android:text="扫一扫"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<View
android:layout_width="45dp"
android:layout_height="1dp"
android:background="#ffffff"/>
<View
android:layout_width="1000dp"
android:layout_height="1dp"
android:background="#e0e0e0"/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/yyy"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/yaoyyao"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/yyy"
android:text="摇一摇"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="10dp"
android:background="#e0e0e0"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/kyk"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/kanykan"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/kyk"
android:text="看一看"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<View
android:layout_width="45dp"
android:layout_height="1dp"
android:background="#ffffff"/>
<View
android:layout_width="1000dp"
android:layout_height="1dp"
android:background="#e0e0e0"/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/sys"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/souysou"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/sys"
android:text="搜一搜"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="10dp"
android:background="#e0e0e0"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/zbfj"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/zhibofujin"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/zbfj"
android:text="直播和附近"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
<View
android:layout_width="match_parent"
android:layout_height="10dp"
android:background="#e0e0e0"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/gouwu"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/kanykan"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/gouwu"
android:text="购物"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<View
android:layout_width="45dp"
android:layout_height="1dp"
android:background="#ffffff"/>
<View
android:layout_width="1000dp"
android:layout_height="1dp"
android:background="#e0e0e0"/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/youxi"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/souysou"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/youxi"
android:text="游戏"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="10dp"
android:background="#e0e0e0"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/xiaochengxu"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/xiaochengxu"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/xiaochengxu"
android:text="小程序"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="12dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
El cuarto fragmento, wode_fragment.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="match_parent"
android:orientation="vertical"
android:background="#f2f2f2">
<!--利用ScrollView实现滚动-->
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:overScrollMode="never">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!--头部-->
<LinearLayout
android:id="@+id/layout_wode_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff">
<Button
android:layout_width="100dp"
android:layout_height="100dp"
android:background="@mipmap/touxiang"
android:layout_marginTop="50dp"
android:layout_marginLeft="20dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="所长的肚子"
android:textSize="30dp"
android:textColor="#000000"
android:layout_marginTop="50dp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="30dp">
<TextView
android:id="@+id/weixinhao"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="微信号:123456789"
android:textSize="20dp"/>
<Button
android:id="@+id/wode_xinxixinxi"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/wode_xinxi"
android:layout_alignParentRight="true"/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@mipmap/wode_ma"
android:layout_toLeftOf="@+id/wode_xinxixinxi"/>
</RelativeLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="+状态"
android:textSize="20dp"
android:background="@null"
/>
</LinearLayout>
</LinearLayout>
<View
android:layout_width="wrap_content"
android:layout_height="10dp"
android:background="#e0e0e0"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/zhifu"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/zhifu"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/zhifu"
android:text="支付"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
<View
android:layout_width="match_parent"
android:layout_height="10dp"
android:background="#e0e0e0"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:orientation="vertical"
android:background="#ffffff">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp">
<ImageView
android:id="@+id/shoucang"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/shoucang"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/shoucang"
android:text="收藏"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp">
<ImageView
android:id="@+id/xiangce"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/xiangce"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/xiangce"
android:text="相册"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp">
<ImageView
android:id="@+id/kabao"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/kabao"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/kabao"
android:text="卡包"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp">
<ImageView
android:id="@+id/biaoqing"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/biaoqing"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/biaoqing"
android:text="表情"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
</LinearLayout>
<View
android:layout_width="wrap_content"
android:layout_height="10dp"
android:background="#e0e0e0"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ffffff">
<ImageView
android:id="@+id/shezhi"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="@mipmap/shezhi"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/shezhi"
android:text="设置"
android:textColor="#000000"
android:textSize="20dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:background="@mipmap/wode_xinxi"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"/>
</RelativeLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
El siguiente es MainActivity.java
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private LinearLayout mMenuWeixin;
private LinearLayout mMenuTongxunlu;
private LinearLayout mMenuFaxian;
private LinearLayout mMenuWode;
private WeixinFragment weixinFragment = new WeixinFragment();
private TongxunluFragment tongxunluFragment = new TongxunluFragment();
private FaxianFragment faxianFragment = new FaxianFragment();
private WodeFragemnt wodeFragemnt = new WodeFragemnt();
ImageView weixinImg;
ImageView tongxunImg;
ImageView faxianImg;
ImageView wodeImg;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
weixinImg = (ImageView) findViewById(R.id.caidan_weixin);
tongxunImg = (ImageView) findViewById(R.id.caidan_tongxun);
faxianImg = (ImageView) findViewById(R.id.caidain_faxian);
wodeImg = (ImageView) findViewById(R.id.caidan_wode);
this.getSupportFragmentManager().beginTransaction()
.add(R.id.container_content,weixinFragment)
.add(R.id.container_content,tongxunluFragment)
.add(R.id.container_content,faxianFragment)
.add(R.id.container_content,wodeFragemnt)
.hide(tongxunluFragment).hide(faxianFragment)
.hide(wodeFragemnt).commit();
}
private void initView() {
mMenuWeixin = this.findViewById(R.id.menu_weixin);
mMenuTongxunlu = this.findViewById(R.id.menu_tongxunlu);
mMenuFaxian = this.findViewById(R.id.menu_faxian);
mMenuWode = this.findViewById(R.id.menu_wode);
mMenuWeixin.setOnClickListener(this);
mMenuTongxunlu.setOnClickListener(this);
mMenuFaxian.setOnClickListener(this);
mMenuWode.setOnClickListener(this);
}
@Override
public void onClick(View v){
switch (v.getId()){
case R.id.menu_weixin:
weixinImg.setImageResource(R.mipmap.weixin02);
tongxunImg.setImageResource(R.mipmap.tongxunlu01);
faxianImg.setImageResource(R.mipmap.faxian01);
wodeImg.setImageResource(R.mipmap.wode01);
this.getSupportFragmentManager().beginTransaction()
.show(weixinFragment).hide(tongxunluFragment)
.hide(faxianFragment).hide(wodeFragemnt)
.commit();break;
case R.id.menu_tongxunlu:
weixinImg.setImageResource(R.mipmap.weixin01);
tongxunImg.setImageResource(R.mipmap.tongxunlu02);
faxianImg.setImageResource(R.mipmap.faxian01);
wodeImg.setImageResource(R.mipmap.wode01);
this.getSupportFragmentManager().beginTransaction()
.show(tongxunluFragment).hide(weixinFragment)
.hide(faxianFragment).hide(wodeFragemnt)
.commit();break;
case R.id.menu_faxian:
weixinImg.setImageResource(R.mipmap.weixin01);
tongxunImg.setImageResource(R.mipmap.tongxunlu01);
faxianImg.setImageResource(R.mipmap.faxian02);
wodeImg.setImageResource(R.mipmap.wode01);
this.getSupportFragmentManager().beginTransaction()
.show(faxianFragment).hide(weixinFragment)
.hide(tongxunluFragment).hide(wodeFragemnt)
.commit();break;
case R.id.menu_wode:
weixinImg.setImageResource(R.mipmap.weixin01);
tongxunImg.setImageResource(R.mipmap.tongxunlu01);
faxianImg.setImageResource(R.mipmap.faxian01);
wodeImg.setImageResource(R.mipmap.wode02);
this.getSupportFragmentManager().beginTransaction()
.show(wodeFragemnt).hide(tongxunluFragment)
.hide(faxianFragment).hide(weixinFragment)
.commit();break;
default:break;
}
}
}
Próximo
En este punto, se ha completado más de la mitad de la producción, y lo guardaré para el próximo artículo.