Android Kotlin 底部菜单栏(三)
LoginSuccessActivity布局
<?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=".LoginSuccessActivity" tools:ignore="MissingConstraints"> <include layout="@layout/toolbar" /> <androidx.viewpager2.widget.ViewPager2 android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" /> <View android:layout_width="match_parent" android:layout_height="1dp" android:background="@color/view_white" /> <com.google.android.material.tabs.TabLayout android:id="@+id/tab_layout" android:layout_width="match_parent" android:layout_height="55dp" app:tabGravity="fill" app:tabIndicatorFullWidth="false" app:tabIndicatorGravity="center" app:tabIndicatorHeight="0dp" app:tabMaxWidth="0dp" app:tabMode="fixed" app:tabRippleColor="@android:color/transparent" app:tabSelectedTextColor="@color/colorPrimary" app:tabTextColor="@android:color/darker_gray" /> </LinearLayout>
toolbar界面
<?xml version="1.0" encoding="utf-8"?> <androidx.appcompat.widget.Toolbar 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:id="@+id/toolbar" android:layout_height="?attr/actionBarSize" android:background="@color/colorPrimary" app:popupTheme="@style/AppTheme.PopupOverlay" tools:ignore="PrivateResource"> <TextView android:id="@+id/toolbar_title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:textColor="@color/white" android:textSize="16sp"/> <ImageView android:id="@+id/iv_search" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="right" android:layout_marginRight="15dp"/> </androidx.appcompat.widget.Toolbar>
colors颜色
<?xml version="1.0" encoding="utf-8"?> <resources> <color name="purple_200">#FFBB86FC</color> <color name="purple_500">#FF6200EE</color> <color name="purple_700">#FF3700B3</color> <color name="teal_200">#FF03DAC5</color> <color name="teal_700">#FF018786</color> <color name="black">#FF000000</color> <color name="white">#FFFFFFFF</color> <color name="colorPrimary">#6200EE</color> <color name="colorPrimaryDark">#3700B3</color> <color name="colorAccent">#03DAC5</color> <color name="view_white">#e8e8e8</color> <color name="light_blue_600">#FF039BE5</color> <color name="light_blue_900">#FF01579B</color> <color name="light_blue_A200">#FF40C4FF</color> <color name="light_blue_A400">#FF00B0FF</color> <color name="black_overlay">#66000000</color> </resources>
styles样式
<?xml version="1.0" encoding="utf-8"?> <resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- Customize your theme here. --> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> </style> <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" /> <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" /> <style name="Widget.Theme.APP.ButtonBar.Fullscreen" parent=""> <item name="android:background">@color/black_overlay</item> <item name="android:buttonBarStyle">?android:attr/buttonBarStyle</item> </style> </resources>
Activity
package com.example.app import android.os.Bundle import androidx.appcompat.app.AppCompatActivity import androidx.fragment.app.Fragment import androidx.viewpager2.adapter.FragmentStateAdapter import com.example.app.databinding.ActivityLoginSuccessBinding import com.example.app.databinding.ActivityMainBinding import com.google.android.material.tabs.TabLayout import com.google.android.material.tabs.TabLayoutMediator /** *@author: jst *@date: 2023/6/19 0000 18:01 *@desc: 主页 */ class LoginSuccessActivity : AppCompatActivity() { //标题 private val titles = arrayOf("首页", "页一", "页二", "页三") private val fragmentList : MutableList<Fragment> = ArrayList() lateinit var binding: ActivityLoginSuccessBinding override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) binding = ActivityLoginSuccessBinding.inflate(getLayoutInflater()); setContentView(binding.getRoot()) initViews(); } /** * 初始化控件 */ private fun initViews() { //初始化fragment fragmentList.add(HomeFragment()) fragmentList.add(GroundingFragment()) fragmentList.add(PackFragment()) fragmentList.add(DeliveryFragment()) //初始化viewPage binding.viewPager!!.adapter = object:FragmentStateAdapter(this){ override fun getItemCount(): Int { return fragmentList.size } override fun createFragment(position: Int): Fragment { return fragmentList[position] } } binding.viewPager.offscreenPageLimit = 3 val tabLayoutMediator = TabLayoutMediator( binding.tabLayout,binding.viewPager, TabLayoutMediator.TabConfigurationStrategy { tab: TabLayout.Tab, position: Int -> tab.text = titles[position] }) tabLayoutMediator.attach() } }
需要多少页就键多少Fragment布局
界面都差不多,我这就只展示一个
HomeFragment
package com.example.app import android.os.Bundle import android.view.LayoutInflater import android.view.View import android.view.ViewGroup import androidx.fragment.app.Fragment import com.example.app.R /** *@author: jst *@date: 2023/6/19 0000 18:01 *@desc: 首页 */ class HomeFragment : Fragment(){ override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle? ): View? { val view = LayoutInflater.from(context).inflate(R.layout.fm_home, null) return view } }
fm_home.xml
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="这是首页" android:textColor="@color/colorPrimary" android:textSize="24sp" app:layout_constraintLeft_toRightOf="parent" app:layout_constraintRight_toLeftOf="parent" app:layout_constraintTop_toBottomOf="parent" app:layout_constraintBottom_toTopOf="parent"/> </androidx.constraintlayout.widget.ConstraintLayout>
效果