Android開發之平板和橫豎屏適配-RecyclerView

巫山老妖發表於2024-10-24
AndroidView

需求：Android中RecyclerView在平板上實現列表橫屏4個卡片，豎屏3個卡片，手機上2個卡片？

1. 新增依賴

確保在 build.gradle 中新增了 RecyclerView 的依賴：

implementation 'androidx.recyclerview:recyclerview:1.2.1'

2. 建立佈局檔案

在 res/layout 目錄下建立一個 RecyclerView 的佈局檔案，例如 activity_main.xml：

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>

3. 建立介面卡

建立一個簡單的 RecyclerView 介面卡，例如 MyAdapter.kt：

class MyAdapter(private val items: List<String>) : RecyclerView.Adapter<MyAdapter.ViewHolder>() {

    class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {
        val textView: TextView = view.findViewById(android.R.id.text1)
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view = LayoutInflater.from(parent.context)
            .inflate(android.R.layout.simple_list_item_1, parent, false)
        return ViewHolder(view)
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        holder.textView.text = items[position]
    }

    override fun getItemCount() = items.size
}

要在螢幕橫豎屏切換時動態更新 RecyclerView 的列數，可以重寫 onConfigurationChanged 方法。這樣，當裝置的配置（如螢幕方向）發生變化時，可以重新設定 GridLayoutManager 的列數。以下是具體實現：

1. 更新 AndroidManifest.xml

首先，確保在 AndroidManifest.xml 中為你的 Activity 新增 configChanges 屬性，以避免 Activity 重建：

<activity
    android:name=".MainActivity"
    android:configChanges="orientation|screenSize">
</activity>

　

2. 修改 MainActivity.kt

在 MainActivity.kt 中，重寫 onConfigurationChanged 方法，並在其中更新 RecyclerView 的列數：

class MainActivity : AppCompatActivity() {

    private lateinit var recyclerView: RecyclerView
    private lateinit var adapter: MyAdapter
    private val items = List(100) { "Item $it" } // 示例資料
    private lateinit var layoutManager: GridLayoutManager

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        recyclerView = findViewById(R.id.recyclerView)
        adapter = MyAdapter(items)
        recyclerView.adapter = adapter

        // 初始化 GridLayoutManager
        layoutManager = GridLayoutManager(this, getColumnCount())
        recyclerView.layoutManager = layoutManager
    }

    override fun onConfigurationChanged(newConfig: Configuration) {
        super.onConfigurationChanged(newConfig)
        // 更新列數
        layoutManager.spanCount = getColumnCount()
        layoutManager.requestLayout() // 請求重新佈局
    }

    private fun getColumnCount(): Int {
        return when {
            resources.configuration.orientation == Configuration.ORIENTATION_LANDSCAPE && isTablet() -> 4
            resources.configuration.orientation == Configuration.ORIENTATION_PORTRAIT && isTablet() -> 3
            else -> 2
        }
    }

    private fun isTablet(): Boolean {
        return (resources.configuration.screenLayout and Configuration.SCREENLAYOUT_SIZE_MASK) >= Configuration.SCREENLAYOUT_SIZE_LARGE
    }
}

　　

3. 執行應用

現在，當你在裝置上切換螢幕方向時，RecyclerView 的列數將根據當前的方向和裝置型別動態更新。

總結

透過重寫 onConfigurationChanged 方法並更新 GridLayoutManager 的列數，你可以實現 RecyclerView 在螢幕橫豎屏切換時的動態變化。這種方式確保了使用者在使用應用時能夠獲得良好的體驗。

　

相關文章