为什么底部的底部绘制在景观中的导航栏下?

发布于 2025-02-04 18:02:05 字数 2730 浏览 5 评论 0 原文

我正在显示一个简单的Android模态底部菜单。在肖像模式下,它可以正常工作,但是当设备旋转到景观时,纸板的底部在导航栏下绘制并隐藏。这是使用片剂仿真器(Pixel C,API 32)。

肖像模式:正确

景观模式:隐藏表的底部

示例代码,使用android Studio“空活动”模板项目和代码从<< a href =“ https://material.io/develop/android/components/bottom-sheet-dialog-fragment#modal-bottom-sheet” rel =“ nofollow noreferrer”>材料文档。

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)
        binding.showDialog.setOnClickListener { showBottomSheetDialog() }
    }


    private fun showBottomSheetDialog() {
        val modalBottomSheet = ModalBottomSheet()
        modalBottomSheet.show(supportFragmentManager, ModalBottomSheet.TAG)
    }
}

class ModalBottomSheet : BottomSheetDialogFragment() {

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? = inflater.inflate(R.layout.bottom_sheet_dialog, container, false)

    companion object {
        const val TAG = "ModalBottomSheet"
    }
}

bottom_sheet_dialog.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="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/text_view_1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="30dp"
        android:paddingVertical="12dp"
        android:text="First Row"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/text_view_2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="30dp"
        android:paddingVertical="12dp"
        android:text="Second Row"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/text_view_3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="30dp"
        android:paddingVertical="12dp"
        android:text="Third Row"
        android:textSize="16sp" />

</LinearLayout>

I am showing a simple Android modal bottom sheet menu. In portrait mode, it works fine, but when the device is rotated to landscape the bottom of the sheet draws under the navigation bar and is hidden. This is using a tablet emulator (Pixel C, API 32).

Portrait mode: correct

Portrait mode: correct

Landscape mode: bottom of sheet is hidden

Landscape mode: bottom of sheet is hidden

Sample code, using the Android Studio "Empty Activity" template project and code from the Material docs.

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)
        binding.showDialog.setOnClickListener { showBottomSheetDialog() }
    }


    private fun showBottomSheetDialog() {
        val modalBottomSheet = ModalBottomSheet()
        modalBottomSheet.show(supportFragmentManager, ModalBottomSheet.TAG)
    }
}

class ModalBottomSheet : BottomSheetDialogFragment() {

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? = inflater.inflate(R.layout.bottom_sheet_dialog, container, false)

    companion object {
        const val TAG = "ModalBottomSheet"
    }
}

bottom_sheet_dialog.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="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/text_view_1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="30dp"
        android:paddingVertical="12dp"
        android:text="First Row"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/text_view_2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="30dp"
        android:paddingVertical="12dp"
        android:text="Second Row"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/text_view_3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="30dp"
        android:paddingVertical="12dp"
        android:text="Third Row"
        android:textSize="16sp" />

</LinearLayout>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

我三岁 2025-02-11 18:02:05

这似乎是故意的Android Tablet UI行为。 (这是一个谜,为什么希望在用户看不到其内容的状态下启动底部表,但无论如何...)

modalbottomsheet

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        dialog?.setOnShowListener {
            (it as? BottomSheetDialog)?.apply {
                behavior.state = BottomSheetBehavior.STATE_EXPANDED
            }
        }
    }

修复 感谢

This appears to be intentional Android tablet UI behaviour. (It's a mystery why it is desirable to start a bottom sheet off in a state where the user can't see its content, but anyway...)

Fixed by adding this into the ModalBottomSheet class:

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        dialog?.setOnShowListener {
            (it as? BottomSheetDialog)?.apply {
                behavior.state = BottomSheetBehavior.STATE_EXPANDED
            }
        }
    }

With thanks to the answers posted in Why does BottomSheetDialog draw under the navigation bar in landscape?

过气美图社 2025-02-11 18:02:05

我觉得按照您的设计,屏幕只能在景观模式下渲染2倍的空间。

尝试提供滚动功能,以便即使将来将更多项目添加到底部表格中,也可以在肖像和景观模式下支持。

I feel the screen can render only 2 times space in Landscape mode as per your design.

Try to provide scrolling feature so that it will support in both Portrait and Landscape mode even in future if you add more items to BottomSheet.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文