【问题标题】:Why does this anko layout not handle the system ui correctly?为什么这个 anko 布局不能正确处理系统 ui?
【发布时间】:2017-02-12 15:10:49
【问题描述】:

我正在试用 Anko,但无法让此布局像 xml 版本那样处理系统 ui。我认为这与主题以及它们如何通过 xml 解析处理有关。

以下是屏幕截图:

这里是 anko DSL 组件:

class ActivityMainLayout : AnkoComponent<Activity> {

    lateinit var drawerLayout: DrawerLayout
    lateinit var appBarLayout: AppBarLayout
    lateinit var toolbar: Toolbar
    lateinit var text: TextView
    lateinit var navHeader: NavigationView
    lateinit var toggle: ActionBarDrawerToggle

    override fun createView(ui: AnkoContext<Activity>): View = with(ui) {
        drawerLayout = drawerLayout {

            fitsSystemWindows = true

            coordinatorLayout {

                appBarLayout = appBarLayout(theme = R.style.AppTheme_AppBarOverlay) {

                    toolbar = toolbar {
                        popupTheme = R.style.AppTheme_PopupOverlay
                        backgroundColor = getColorPrimary(ui.owner)
                    }.lparams(width = matchParent, height = getActionBarSize(ui.owner))

                }.lparams(width = matchParent)

                nestedScrollView {

                    text = textView {
                        text = "Anko Version"
                        textSize = 40f
                    }.lparams {
                        margin = dip(16)
                    }

                }.lparams(width = matchParent) {
                    behavior = AppBarLayout.ScrollingViewBehavior()
                }

            }.lparams(width = matchParent, height = matchParent)

            navHeader = navigationView {
                inflateHeaderView(R.layout.nav_header_test_design)
                inflateMenu(R.menu.activity_test_design_drawer)
            }.lparams(height = matchParent) {
                gravity = Gravity.START
            }
        }

        toggle = ActionBarDrawerToggle(
                ui.owner, drawerLayout, toolbar,
                R.string.navigation_drawer_open, R.string.navigation_drawer_close)

        return drawerLayout
    }

    fun getActionBarSize(ctx: Context): Int {
        val attrs = IntArray(1)
        attrs[0] = attr.actionBarSize
        val array = ctx.obtainStyledAttributes(attrs)
        val size = array.getDimensionPixelSize(0, 0)
        array.recycle()
        return size
    }

    fun getColorPrimary(ctx: Context): Int {
        val attrs = IntArray(1)
        attrs[0] = attr.colorPrimary
        val array = ctx.obtainStyledAttributes(attrs)
        val color = array.getColor(0, 0)
        array.recycle()
        return color
    }

这是xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/AppTheme.AppBarOverlay">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:popupTheme="@style/AppTheme.PopupOverlay" />

        </android.support.design.widget.AppBarLayout>

        <android.support.v4.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="16dp"
                android:textSize="40dp"
                android:text="XML Version" />

        </android.support.v4.widget.NestedScrollView>

    </android.support.design.widget.CoordinatorLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_test_design"
        app:menu="@menu/activity_test_design_drawer" />

</android.support.v4.widget.DrawerLayout>

这是styles.xml:

<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.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
    </style>

    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />

</resources>

【问题讨论】:

    标签: android xml android-styles anko


    【解决方案1】:

    我已经设法通过简单地从 drawerLayout { ... } 块中删除 fitsSystemWindows = true 来解决问题。

    我将fitsSystemWindows = true 保留在coordinatorLayout { ... }navigationView { ... } 块中。通过此更改,StatusBar 是透明的,并且在 AppBar 顶部为其保留了正确的填充空间。

    但是,我发现另一个问题仍然存在:AppBar 本身可以向上滚动并在 Android 状态栏后面(?!),这是不应该发生的事情......

    我通过在appBarLayout { ... }lparams 块中添加behavior = AppBarLayout.ScrollingViewBehavior() 解决了这个问题(themedAppBarLayout 也可以这样),如下所示:

    themedAppBarLayout(theme = R.style.AppTheme_AppBarOverlay) {
        toolbar() {
            id = R.id.toolbar
            popupTheme = R.style.AppTheme_PopupOverlay
            backgroundResource = R.color.colorPrimary
        }.lparams(width = matchParent, height = dimenAttr(R.attr.actionBarSize))
    }.lparams(width = matchParent) {
        behavior = AppBarLayout.ScrollingViewBehavior()
    }
    

    这使得 AppBar 固定且不再可滚动(应该如此)。

    这两个问题可能是相关的,并且在本期 GitHub 上的 Anko 项目中也有引用: NavigationDrawer makes status bar with white background · Issue #298 · Kotlin/anko

    这适用于 Android Studio 3.0 Beta 2、Kotlin 1.1.4-2 和 Anko 0.10.1。

    【讨论】:

      猜你喜欢
      • 2012-01-29
      • 2011-08-28
      • 1970-01-01
      • 1970-01-01
      • 2019-10-21
      • 2019-05-21
      • 2015-05-17
      • 1970-01-01
      • 2011-06-19
      相关资源
      最近更新 更多