Android實現類似iOS分欄控制器

2022-03-21 16:00:18

近公司接了一個專案，需要會安卓，人手不夠的情況作為一個開發iOS的也需要跟進，開始學習android，整合式開發環境以後。直接就被難到了，iOS裡面的分欄控制器（tabbarcontroller）android裡面根本沒有這個控制元件，安卓都是自己來實現這個效果的。所以開始研究android是如何實現的，下面這些程式碼。

當我們建立一個android APP專案的時候會自動生成一個MainActivity，我們可以在這Activity實現這個效果。首先我們先看一下效果圖

程式碼實現

<?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"
    android:orientation="vertical"
    android:background="@color/app_ui_bg"
    tools:context="com.zkteco.pridebiosecurity.view.MainActivity">
 
    <FrameLayout
        android:id="@+id/main_fl"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>
 
    <View
        android:layout_width="match_parent"
        android:layout_height="1px"
        android:background="@color/gray2"/>
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="@dimen/d50"
        android:background="@color/white"
        android:orientation="horizontal">
 
        <LinearLayout
            android:id="@+id/message_ll"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
 
            <ImageView
                android:id="@+id/message_iv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:scaleType="centerInside"
                android:src="@mipmap/ic_message_1"/>
 
            <TextView
                android:id="@+id/message_tv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/d3"
                android:text="@string/message"
                android:textColor="@color/app_style_color"
                android:textSize="@dimen/s11"/>
 
        </LinearLayout>
 
        <LinearLayout
            android:id="@+id/clock_ll"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
 
            <ImageView
                android:id="@+id/clock_iv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:scaleType="centerInside"
                android:src="@mipmap/ic_clock_0"/>
 
            <TextView
                android:id="@+id/clock_tv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/d3"
                android:text="@string/clock"
                android:textColor="@color/gray"
                android:textSize="@dimen/s11"/>
 
        </LinearLayout>
 
        <LinearLayout
            android:id="@+id/home_ll"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
 
            <ImageView
                android:id="@+id/home_iv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:scaleType="centerInside"
                android:src="@mipmap/ic_home_0"/>
 
 
            <TextView
                android:id="@+id/home_tv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/d3"
                android:text="@string/home"
                android:textColor="@color/gray"
                android:textSize="@dimen/s11"/>
 
        </LinearLayout>
 
 
        <LinearLayout
            android:id="@+id/entrance_ll"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
 
            <ImageView
                android:id="@+id/entrance_iv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:scaleType="centerInside"
                android:src="@mipmap/ic_entrance_0"/>
 
 
            <TextView
                android:id="@+id/entrance_tv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/d3"
                android:text="@string/entrance"
                android:textColor="@color/gray"
                android:textSize="@dimen/s11"/>
 
        </LinearLayout>
 
        <LinearLayout
            android:id="@+id/me_ll"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">
 
            <ImageView
                android:id="@+id/me_iv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:scaleType="centerInside"
                android:src="@mipmap/ic_me_0"/>
 
            <TextView
                android:id="@+id/me_tv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/d3"
                android:text="@string/me"
                android:textColor="@color/gray"
                android:textSize="@dimen/s11"/>
 
        </LinearLayout>
 
    </LinearLayout>
 
</LinearLayout>

這樣頁面我們就實現了。

接下來就是點選切換頁面的效果實現了，程式碼主要就是實現點選切換頁面的功能。所以我們要關聯一下五個Fragment了

package com.zkteco.pridebiosecurity.view;
 
import android.annotation.SuppressLint;
import android.os.Build;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.view.WindowManager;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
 
import com.zkteco.pridebiosecurity.R;
import com.zkteco.pridebiosecurity.base.BaseActivity;
import com.zkteco.pridebiosecurity.base.BaseFragment;
import com.zkteco.pridebiosecurity.util.StatusBarUtil;
import com.zkteco.pridebiosecurity.view.clock.ClockFragment;
import com.zkteco.pridebiosecurity.view.entrance.EntranceFragment;
import com.zkteco.pridebiosecurity.view.home.HomeFragment;
import com.zkteco.pridebiosecurity.view.me.MeFragment;
import com.zkteco.pridebiosecurity.view.message.MessageFragment;
import com.zkteco.pridebiosecurity.widget.TitleBar;
 
/**
 * 程式主介面
 *
 * Created by sunyd on 2019/2/22.
 */
public class MainActivity extends BaseActivity implements OnClickListener {
 
    private LinearLayout mMessageLl, mColckLl, mHomeLl, mEntranceLl, mMeLl;
    private ImageView mMessageIv, mColckIv, mHomeIv, mEntranceIv, mMeIv;
    private TextView mMessageTv, mColckTv, mHomeTv, mEntranceTv, mMeTv;
    private BaseFragment baseFragment;
    
    @Override
    protected int bindLayout() {
        return R.layout.activity_main;
    }
 
    @Override
    protected void initView() {
        // 設定狀態列背景藍色，文字白色
        StatusBarUtil.setStatusBarLightMode(this, false);
 
        mMessageLl = bindView(R.id.message_ll);
        mColckLl = bindView(R.id.clock_ll);
        mHomeLl = bindView(R.id.home_ll);
        mEntranceLl = bindView(R.id.entrance_ll);
        mMeLl = bindView(R.id.me_ll);
        mMessageIv = bindView(R.id.message_iv);
        mColckIv = bindView(R.id.clock_iv);
        mHomeIv = bindView(R.id.home_iv);
        mEntranceIv = bindView(R.id.entrance_iv);
        mMeIv = bindView(R.id.me_iv);
        mMessageTv = bindView(R.id.message_tv);
        mColckTv = bindView(R.id.clock_tv);
        mHomeTv = bindView(R.id.home_tv);
        mEntranceTv = bindView(R.id.entrance_tv);
        mMeTv = bindView(R.id.me_tv);
 
        changeFragment(MessageFragment.class, 0);
    }
 
    @Override
    protected void initData() {
 
    }
 
    @Override
    protected void setListeners() {
        mMessageLl.setOnClickListener(this);
        mColckLl.setOnClickListener(this);
        mHomeLl.setOnClickListener(this);
        mEntranceLl.setOnClickListener(this);
        mMeLl.setOnClickListener(this);
    }
 
    @Override
    protected void autoRefresh() {
 
    }
 
    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.message_ll:
                changeFragment(MessageFragment.class, 0);
                break;
            case R.id.clock_ll:
                changeFragment(ClockFragment.class, 1);
                break;
            case R.id.home_ll:
                changeFragment(HomeFragment.class, 2);
                break;
            case R.id.entrance_ll:
                changeFragment(EntranceFragment.class, 3);
                break;
            case R.id.me_ll:
                changeFragment(MeFragment.class, 4);
                break;
        }
    }
 
    /**
     * 切換主介面
     * @param clazz
     * @param position
     */
    public void changeFragment(Class<? extends Fragment> clazz, int position) {
        FragmentManager fm = getSupportFragmentManager();
        FragmentTransaction ft = fm.beginTransaction();
        Fragment fragment = fm.findFragmentByTag(clazz.getName());
 
        if (fragment == null) {
            try {
                fragment = clazz.newInstance();
            } catch (Exception e) {
                e.printStackTrace();
            }
        }
 
        if (baseFragment != null && baseFragment != fragment) {
            ft.hide(baseFragment);
        }
 
        if (!fragment.isAdded()) {
            ft.add(R.id.main_fl, fragment, clazz.getName());
        } else {
            ft.show(fragment);
        }
 
        ft.commitAllowingStateLoss();
        baseFragment = (BaseFragment) fragment;
 
        mMessageIv.setImageResource(R.mipmap.ic_message_0);
        mColckIv.setImageResource(R.mipmap.ic_clock_0);
        mHomeIv.setImageResource(R.mipmap.ic_home_0);
        mEntranceIv.setImageResource(R.mipmap.ic_entrance_0);
        mMeIv.setImageResource(R.mipmap.ic_me_0);
        mMessageTv.setTextColor(getResources().getColor(R.color.gray));
        mColckTv.setTextColor(getResources().getColor(R.color.gray));
        mHomeTv.setTextColor(getResources().getColor(R.color.gray));
        mEntranceTv.setTextColor(getResources().getColor(R.color.gray));
        mMeTv.setTextColor(getResources().getColor(R.color.gray));
 
        if (position == 0) {
            mMessageIv.setImageResource(R.mipmap.ic_message_1);
            mMessageTv.setTextColor(getResources().getColor(R.color.app_style_color));
        } else if (position == 1) {
            mColckIv.setImageResource(R.mipmap.ic_clock_1);
            mColckTv.setTextColor(getResources().getColor(R.color.app_style_color));
        } else if (position == 2) {
            mHomeIv.setImageResource(R.mipmap.ic_home_1);
            mHomeTv.setTextColor(getResources().getColor(R.color.app_style_color));
        } else if (position == 3) {
            mEntranceIv.setImageResource(R.mipmap.ic_entrance_1);
            mEntranceTv.setTextColor(getResources().getColor(R.color.app_style_color));
        } else if (position == 4) {
            mMeIv.setImageResource(R.mipmap.ic_me_1);
            mMeTv.setTextColor(getResources().getColor(R.color.app_style_color));
        }
    }
}

這裡呢，每一個Fragment都繼承了BaseFragment，下面是BaseFragment的程式碼實現

/**
 * TODO
 * By sunyd, 2016-7-19
 */
package com.zkteco.pridebiosecurity.base;
 
import android.content.Context;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.FragmentManager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
 
import com.zkteco.pridebiosecurity.widget.LoadingDialog;
 
/**
 * fragment基礎類別
 *
 * @author sunyd, 2016-7-19
 */
public abstract class BaseFragment extends android.support.v4.app.Fragment {
 
    protected Context mContext;
    private LoadingDialog mABLoadingDialog;
    protected View mRootView;
 
    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }
 
    @Override
    @Nullable
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(bindLayout(), container, false);
    }
 
    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        mABLoadingDialog = new LoadingDialog(getActivity());
        mContext = getActivity();
        mRootView = view;
        initView();
    }
 
    protected <T extends View> T bindView(int id) {
        @SuppressWarnings("unchecked") T t = (T) mRootView.findViewById(id);
        return t;
    }
 
    @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        initData();
        setListeners();
    }
 
    @Override
    public void onResume() {
        super.onResume();
        autoRefresh();
    }
 
    /**
     * 繫結佈局
     * @return
     */
    protected abstract int bindLayout();
 
    /**
     * 初始化元件
     */
    protected abstract void initView();
 
    /**
     * 資料
     */
    protected abstract void initData();
 
    /**
     * 設定監聽
     */
    protected abstract void setListeners();
 
    /**
     * 自動重新整理
     */
    protected abstract void autoRefresh();
 
    /**
     * 載入動畫
     * @param show
     */
    public void showOrHideWaitBar(boolean show) {
        if (mABLoadingDialog != null) {
            if (show) {
                mABLoadingDialog.show();
            } else {
                mABLoadingDialog.dismiss();
            }
        }
    }
 
    @Override
    public void onDestroy() {
        if (mABLoadingDialog != null && mABLoadingDialog.isDialogShowing()) {
            mABLoadingDialog.dismiss();
        }
        super.onDestroy();
    }
}

MainActivity繼承BaseActivity，下面便是BaseActivity實現程式碼

 package com.zkteco.pridebiosecurity.base;
 
import android.annotation.SuppressLint;
import android.content.Context;
import android.os.Build;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
 
import com.zkteco.pridebiosecurity.R;
import com.zkteco.pridebiosecurity.util.StatusBarUtil;
import com.zkteco.pridebiosecurity.widget.LoadingDialog;
 
 
/**
 * activity基礎類別
 *
 * @author sunyd, 2019-2-25
 */
@SuppressLint("NewApi")
public abstract class BaseActivity extends AppCompatActivity {
 
    private LoadingDialog mABLoadingDialog;
    protected Context mContext;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        BaseApplication.getInstance().addActivity(this);
        // 設定狀態列背景白色，文字黑色
        StatusBarUtil.setStatusBarLightMode(this, true);
        setContentView(bindLayout());
 
        mABLoadingDialog = new LoadingDialog(this);
        mContext = this;
        initView();
        initData();
        setListeners();
    }
 
    @Override
    protected void onResume() {
        super.onResume();
        autoRefresh();
    }
 
    @Override
    public void finish() {
        BaseApplication.getInstance().removeAcitivity(this);
        super.finish();
    }
 
    /**
     * 簡化初始化過程
     * @param id
     * @param <T>
     * @return
     */
    protected <T extends View> T bindView(int id) {
        @SuppressWarnings("unchecked") T t = (T) findViewById(id);
        return t;
    }
 
    /**
     * 繫結佈局
     * @return
     */
    protected abstract int bindLayout();
 
    /**
     * 初始化元件
     */
    protected abstract void initView();
 
    /**
     * 資料
     */
    protected abstract void initData();
 
    /**
     * 設定監聽
     */
    protected abstract void setListeners();
 
    /**
     * 自動重新整理
     */
    protected abstract void autoRefresh();
 
    /**
     * 載入動畫
     */
    public void showOrHideWaitBar(boolean show) {
        if (mABLoadingDialog != null) {
            if (show) {
                mABLoadingDialog.show();
            } else {
                mABLoadingDialog.dismiss();
            }
        }
    }
 
    @Override
    public void onDestroy() {
        if (mABLoadingDialog != null && mABLoadingDialog.isDialogShowing()) {
            mABLoadingDialog.dismiss();
        }
        super.onDestroy();
    }
 
}

以上便實現了，這個功能的所有效果。

當我們APP使用時也會常用到Application，也就是iOS裡面的AppDelegate。可以方便我們實現很多方法

下面是Application的實現

package com.zkteco.pridebiosecurity.base;
 
import android.app.Activity;
import android.app.Application;
import android.content.Intent;
 
import com.zkteco.pridebiosecurity.util.CrashHandler;
import com.zkteco.pridebiosecurity.view.login.LoginActivity;
 
import java.util.Set;
import java.util.WeakHashMap;
 
/**
 * APP主入口
 *
 * @author sunyd, 2016-7-19
 */
public class BaseApplication extends Application {
 
    private final WeakHashMap<Activity, Integer> mActivityGroup = new WeakHashMap<>(1);
    private static BaseApplication sInstance = null;
 
    @Override
    public void onCreate() {
        super.onCreate();
        sInstance = this;
    }
 
    /**
     * 獲取全域性context
     * @return
     */
    public static BaseApplication getInstance() {
        return sInstance;
    }
 
    /**
     * 新增Activity
     * @param a
     */
    protected void addActivity(Activity a) {
        mActivityGroup.put(a, 0);
    }
 
    /**
     * 移除Activity
     * @param a
     */
    protected void removeAcitivity(Activity a) {
        mActivityGroup.remove(a);
    }
 
    /**
     * 獲取所有Activity
     * @param c
     * @return
     */
    public Activity getActivityOfClass(Class<?> c) {
        Set<Activity> set = mActivityGroup.keySet();
        for (Activity a : set) {
            if (a.getClass() == c) {
                return a;
            }
        }
        return null;
    }
 
    /**
     * 退出所有Activity
     */
    public void exitAllActivities() {
        while (mActivityGroup.size() > 0) {
            Set<Activity> as = mActivityGroup.keySet();
            ((Activity[]) as.toArray())[0].finish();
        }
        mActivityGroup.clear();
    }
}

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援it145.com。

Android實現類似iOS分欄控制器

熱門文章