安卓实现左侧列表选择项点击，右侧fragment切换

安卓实现左侧列表选择项点击，右侧fragment切换

问题背景

安卓日常开发中，有时候需要开发页面中，显示左侧会列表选择项，点击不同的选项后右侧切换fragment显示，本文将介绍实现的一个思路。

问题分析

要实现的效果如下：

问题解决

话不多说，直接上代码。
（1）activity布局文件如下，主要包括左侧的竖直列表和右侧的fragment：

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

    <ListView
        android:id="@+id/mListview"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:background="#ebebeb"
        android:layout_height="match_parent"/>

    <FrameLayout
        android:id="@+id/mFrame"
        android:layout_width="0dp"
        android:layout_weight="3"
        android:layout_height="match_parent"/>

</LinearLayout>

（2）左侧列表item布局，item_left_list.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">

    <LinearLayout
        android:id="@+id/ll_menu"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/tv_line"
            android:layout_width="3dp"
            android:layout_height="match_parent"
            android:background="#ff0000"
            android:visibility="invisible"/>

        <TextView
            android:id="@+id/tv_text"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"/>

    </LinearLayout>

</LinearLayout>

（3）右侧fragment布局，代码如下：

<?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">
    <TextView
        android:id="@+id/tv_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:textSize="30dp"/>
</LinearLayout>

（4）对应activity文件，代码如下：

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

import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.FrameLayout;
import android.widget.ListView;

import com.baorant.layoutdemo.R;
import com.baorant.layoutdemo.adapter.MyAdapter;
import com.baorant.layoutdemo.fragment.ItemFragment;
import com.baorant.layoutdemo.model.User;

import java.util.ArrayList;
import java.util.List;

public class LeftListViewAcitvity extends AppCompatActivity
        implements AdapterView.OnItemClickListener {

    ListView mListview;
    FrameLayout mFrame;
    // listview的数据集合
    List<User> mList = new ArrayList();
    List<Fragment> fragmentList = new ArrayList<>();
    private MyAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_left_list_view_acitvity);
        initView();
        initData();
    }

    //    初始化数据
    private void initData() {
//        初始化左侧列表数据
        initLeftListData();
//        加载fragment
        initFragment();
//        默认选中页面1
        chooseListItem(0);
    }

    //    切换fragment
    private void chooseListItem(int position) {
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
//        隐藏所有的fragment
        for(int i = 0; i < fragmentList.size(); i++ ){
            Fragment fragment = fragmentList.get(i);
            transaction.hide(fragment);
        }
        transaction.show(fragmentList.get(position));
        transaction.commit();
    }

    private void initFragment() {
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        ItemFragment showFragment = new ItemFragment();
        for(int i = 0; i < mList.size(); i++){
            Fragment fragment = showFragment.getShowFragment(mList.get(i).getName());
            fragmentList.add(fragment);
        }
        for(int i = 0; i < fragmentList.size(); i++){
            transaction.add(R.id.mFrame,fragmentList.get(i));
        }
        transaction.commit();
    }

    private void initLeftListData() {
        for(int i = 1; i <= 10; i++){
            mList.add(new User("页面" + i));
        }
        adapter = new MyAdapter(mList,this);
        mListview.setAdapter(adapter);
        mListview.setOnItemClickListener(this);
    }

    //  控件初始化
    private void initView() {
        mListview = findViewById(R.id.mListview);
        mFrame = findViewById(R.id.mFrame);
    }

    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
//        点击item切换fragment
        chooseListItem(position);
        for(int i = 0; i < mList.size(); i++){
//            先把所有的item标记为未被选中
            mList.get(i).setChecked(false);
        }
//        找出被选中的item，把user中的ischecked属性改为true
        mList.get(position).setChecked(true);
//        刷新适配器
        adapter.notifyDataSetChanged();
    }
}

（5）左侧列表对应的adapter文件，代码如下：

import android.content.Context;
import android.graphics.Color;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.baorant.layoutdemo.R;
import com.baorant.layoutdemo.model.User;

import java.util.List;

public class MyAdapter extends BaseAdapter {
    List<User> mList;
    Context context;

    public MyAdapter(List<User> mList, Context context) {
        this.mList = mList;
        this.context = context;
    }

    @Override
    public int getCount() {
        return mList != null ? mList.size() : 0;
    }

    @Override
    public Object getItem(int position) {
        return null;
    }

    @Override
    public long getItemId(int position) {
        return 0;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder;
        if(convertView == null){
            holder = new ViewHolder();
            convertView = LayoutInflater.from(context).inflate(R.layout.item_left_list, null);
            holder.tvText = convertView.findViewById(R.id.tv_text);
            holder.tvLine = convertView.findViewById(R.id.tv_line);
            holder.llMenu = convertView.findViewById(R.id.ll_menu);
            convertView.setTag(holder);
        }else{
            holder = (ViewHolder) convertView.getTag();
        }

        if(mList.get(position).isChecked()){
            holder.tvText.setTextColor(Color.RED);
            holder.tvLine.setVisibility(View.VISIBLE);
            holder.llMenu.setBackgroundColor(Color.WHITE);
        }else{
            holder.tvText.setTextColor(Color.BLACK);
            holder.tvLine.setVisibility(View.GONE);
            holder.llMenu.setBackgroundColor(Color.parseColor("#ebebeb"));
        }
        String name = mList.get(position).getName();
        holder.tvText.setText(name);
        return convertView;
    }
    class ViewHolder {
        LinearLayout llMenu;
        TextView tvText;
        TextView tvLine;
    }
}

（6）定义的fragment，代码如下：

import android.annotation.SuppressLint;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;

import com.baorant.layoutdemo.R;

public class ItemFragment extends Fragment {
    TextView tvText;
    private String name;

    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        Bundle bundle = getArguments();
        if(bundle != null){
            name = bundle.getString("name");
        }
    }

    public static Fragment getShowFragment(String name){
        ItemFragment showFragment = new ItemFragment();
        Bundle bundle = new Bundle();
        bundle.putString("name",name);
        showFragment.setArguments(bundle);
        return showFragment;
    }

    @SuppressLint("MissingInflatedId")
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_show,null);
        tvText = view.findViewById(R.id.tv_content);
        tvText.setText(name);
        return view;
    }
}

问题总结

本文介绍了安卓开发中，左侧显示列表选择项，点击不同的选项后右侧切换fragment显示的一种方案，有兴趣的同学可以进一步深入研究。