Android在fragment中編寫toobar的步驟詳解
阿新 • • 發佈：2021-01-15
第一步的話就是首先匯入我們的依賴的包：
compile 'com.android.support:appcompat-v7:23.3.0'
第二步的話就是準備我們的佈局檔案和我們的item
在這的話我是將我們的toobar單獨的放在一個佈局檔案中的方便以後的呼叫以及將我們的主題改為
我們noactionbar,同時在我們的主檔案中進行引用
修改為nopactionbar
引用
設定單獨的xml檔案
然後的話就是我們在我們的這個位置設定的是我們的啊就是toobar的單獨的一個檔案程式碼如下：
<?xml version="1.0" encoding="utf-8"?> <androidx.appcompat.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/toobar" android:background="#00E109" android:minHeight="?attr/actionBarSize" android:layout_width="match_parent" android:layout_height="wrap_content"> <!--現在的這個位置的話是我們的toobar的工具類我們將toobar 的工具類創建出來後就是方便在我們的程式要用到的任何的地方呼叫--> </androidx.appcompat.widget.Toolbar>
第三步： 然後的話就是編寫我們的就是啊item就是我們的選單項
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <item android:icon="@drawable/ic_baseline_youtube_searched_for_24" android:id="@+id/search" android:title="搜尋" android:orderInCategory="80" app:showAsAction="ifRoom" /> <item android:icon="@drawable/ic_sharp_share_24" android:id="@+id/share" android:title="分享" android:orderInCategory="80" app:showAsAction="ifRoom" /> <item android:icon="@drawable/ic_baseline_drag_indicator_24" android:id="@+id/other" android:title="更多" android:orderInCategory="80" app:showAsAction="ifRoom" /> </menu>
然後的話是我們的就是frgment的佈局的程式碼中進行引用：
<?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=".ui.home.HomeFragment">
<!--這個位置的話是那我們的首頁面的佈局檔案然後的話就是實現我們的首頁面的功能
todo 使用線性佈局，然後的話是我們的就是搜尋框
-->
<!-- todo 在我們的這個位置就是將我們的toobar引入進來-->
<include layout="@layout/toobarutil"/>
<!--todo 使用我們的scrollview進行佈局-->
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.SearchView
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:ignore="MissingConstraints" />
<!--todo 在我們的這裡的話使用我們的banner和我們的glide實現我們男的圖片的輪播-->
<com.youth.banner.Banner
android:id="@+id/Banner"
android:layout_width="match_parent"
android:layout_height="250dp" />
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</LinearLayout>最後的話就是我們的java程式碼部分了：
package com.example.smartcityend.ui.home;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.SurfaceControl;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.Toolbar;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.Observer;
import androidx.lifecycle.ViewModelProvider;
import com.bumptech.glide.Glide;
import com.example.smartcityend.BuildConfig;
import com.example.smartcityend.R;
import com.youth.banner.Banner;
import com.youth.banner.BannerConfig;
import com.youth.banner.Transformer;
import com.youth.banner.listener.OnBannerListener;
import com.youth.banner.loader.ImageLoader;
import java.util.ArrayList;
import java.util.List;
public class HomeFragment extends Fragment implements OnBannerListener {
private Banner banner;
private Toolbar toolbar;
public View onCreateView(@NonNull LayoutInflater inflater,ViewGroup container,Bundle savedInstanceState) {
View root = inflater.inflate(R.layout.fragment_home,container,false);
return root;
}
//todo 接下來的話實現我們的圖片的輪播使用我們的banner,在我們的就是onviewcreate中編寫我們的程式碼
@Override
public void onViewCreated(@NonNull View view,@Nullable Bundle savedInstanceState) {
super.onViewCreated(view,savedInstanceState);
Banner(); // 呼叫輪播的方法
Toobar(); // 呼叫toobar的方法
}
@Override
public void onCreateOptionsMenu(@NonNull Menu menu,@NonNull MenuInflater inflater) {
((AppCompatActivity) getActivity()).getMenuInflater().inflate(R.menu.toobar_title,menu);
return ;
// todo 這個方法也是伴隨著我們的就是toobar存在的作用就是在我們的onsetmenuitemclickn的回撥
}
private void Toobar() {
// 接下來的話就是呼叫我們的toobar的方法 找到我們的toobar的id
toolbar = (Toolbar) getActivity().findViewById(R.id.toobar);
// 呼叫actionbar的方法將actionbar設定為自己的toobar
setHasOptionsMenu(true);
((AppCompatActivity) getActivity()).setSupportActionBar(toolbar);
// 獲取actionbar的物件使用action的方法
((AppCompatActivity) getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(true);
// 然後的話就是設定我們的toobar的主題等
toolbar.setTitle("首頁");
// 設定我們的副標題
toolbar.setSubtitle("智慧城市");
// 設定我們的導航選單
toolbar.setNavigationIcon(R.drawable.ic_baseline_chevron_left_24);
// 然後的話為我們的導航選單新增點選事件
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
// 然後的話就是為我們的返回圖示新增點選事件這裡的話我們就為我們的返回圖示新增點選返回事件
}
});
// 設定選單的就是啊彈出的樣式和背景
toolbar.setPopupTheme(R.style.Widget_AppCompat_ActionBar_Solid);
// 設定我們的選單 todo 要另外在我們的選單的佈局檔案中新增我們的就是啊xml佈局
toolbar.inflateMenu(R.menu.bottom_nav_menu);
// 然後的話就是為我們的啊查選單項設定點選事件
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
// 然後的話就是為我們的選單項設定我們的點選監聽事件
switch (item.getItemId()){
case R.id.search:
Toast.makeText( getContext(),"你點選的是搜尋按鈕",Toast.LENGTH_SHORT).show();
break;
case R.id.share:
Toast.makeText(getActivity(),"你點選的是分享按鈕",Toast.LENGTH_LONG).show();
break;
case R.id.other:
Toast.makeText(getActivity(),"謝謝分享",Toast.LENGTH_LONG).show();
break;
default:
}
return true;
}
});
}
private void Banner(){
// todo step1: 找到我們的就是id,轉換 為成員變數方便在其他的位置呼叫
banner = (Banner) getActivity().findViewById(R.id.Banner);
// 建立我們的存放圖片的陣列將我們的圖片存放進去
int[] images = new int[]{
// 在我們的這個位置存放我們的圖片
R.mipmap.banner1,R.mipmap.banner2,R.mipmap.banner3,R.mipmap.banner4,R.mipmap.banner5
};
// 建立我們的列表放置我們的圖片的資訊
List<Integer> iamgesList = new ArrayList<>();
// 然後的話就是使用我們的陣列新增我們的圖片的資訊
for(int i = 0; i<images.length; i++){
iamgesList.add(images[i]); // 將我們男的圖片新增到我們的列表中
// 設定我們的圖片載入器
banner.setImageLoader(new ImageLoader() {
@Override
public void displayImage(Context context,Object path,ImageView imageView) {
// 圖片載入器
Glide.with(getActivity()).load(path).into(imageView);
}
});
// 然後的話就是我們的banner和我們的隔離的自帶的圖片輪播效果
banner.setBannerAnimation(Transformer.Default);
// 將我們的圖片從列表中載入進來
banner.setImages(iamgesList);
// 設定我們的顯示器的位置
banner.setIndicatorGravity(BannerConfig.CENTER);
// 然後的話就是設定我們的切換的間隔時間
banner.setDelayTime(5000);
// 設定我們的輪播監聽事件
banner.setOnBannerListener(this);
//然後的話就是我們的圖片的輪播自動開始
banner.start();
}
}
// todo 在我們的這個位置重寫我們的onstart和onstop方法 banner
@Override
public void onStart() {
super.onStart();
// 開始
banner.startAutoPlay();
}
@Override
public void onStop() {
super.onStop();
// 停止
banner.stopAutoPlay();
}
@Override
public void OnBannerClick(int position) {
// 設定我們的輪播圖的點選提示
Toast.makeText(getActivity(),"你點選了第"+(position+1)+"張輪播圖",Toast.LENGTH_LONG).show();
}
}
// todo 好現在的話我們可以看到我們的搜尋框模組和我們的輪播圖的模組是已經建立完成了現在的話就是開始封裝我們的就是toobar模組讓我們的toobar模組可以在我們的各處呼叫
到此這篇關於Android在fragment中編寫toobar的步驟詳解的文章就介紹到這了,更多相關Android fragment toobar內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！