web-dev-qa-db-ja.com

KitKatの半透明のシステムバーとコンテンツマージン

新しいKitKat半透明システムバーを利用して、アプリの背景に全画面画像を表示しようとしています。

必要な動作を得るための適切な設定を理解するのに問題があります。現在、ViewPagerが3つあるFragmentがあり、それぞれがRelativeLayout(背景画像用)とコンテンツ用のImageViewを含むTextViewで構成されています。

私が求めているのは、インタラクションに使用できる画面の部分にコンテンツを完全に収め、画像を画面の表示部分全体に表示することです。

Android:Theme.Holo.Light.NoActionBar.TranslucentDecorをテーマとして使用するだけの場合、縦向きではうまく見えますが、ナビゲーションバーは横向きのコンテンツと重なっています(下のスクリーンショットを参照)。

First attempt - portrait. Looks good.First attempt - landscape. nav bar overlaps the content

ドキュメントの推奨事項 に続いて、テーマにAndroid:fitsSystemWindows = trueを追加しましたが、奇妙なアーティファクトが生成されます(以下を参照) Second attempt - portrait. Artifacts!!Second attempt - landscape. Artifacts!!

2番目の例のように動作させるが、視覚的なアーティファクトなしで見栄えをよくするにはどうすればよいですか?

22

私はこれが古いことを知っていますが、同じ問題に遭遇し、簡単な解決策を見つけたので、Googleの周りの誰かがこれに遭遇した場合に備えて共有したいと思いました。

ViewPager(特にImageSwitcher)がAndroid:fitsSystemWindows="true"属性を持つレイアウト内に配置されると、Androidバグがあるようです。何らかの理由で、システムウィンドウにアーティファクトが全体に表示されているようです。 :/

とにかく、私は修正を見つけました。私の活動では、次のようなXMLレイアウトがありました。

<FrameLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    <!-- NOT HERE! Android:fitsSystemWindows="true" -->
    Android:layout_width="match_parent"
    Android:layout_height="match_parent">

    <ImageSwitcher
        Android:id="@+id/background_image_switcher"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:padding="0dp"
        Android:layout_margin="0dp"
        Android:background="@color/background_dark_navy"
        Android:inAnimation="@Android:anim/fade_in"
        Android:outAnimation="@Android:anim/fade_out"
        >

        <ImageView
            style="@style/BlurredBackgroundImage"
            />
        <ImageView
            style="@style/BlurredBackgroundImage"
            />

    </ImageSwitcher>

    <FrameLayout
        Android:fitsSystemWindows="true" <!-- Here!!! -->
        Android:layout_width="match_parent"
        Android:layout_height="match_parent">

        <!-- Fitted content here -->

    </FrameLayout>

トリックは、Android:fitsSystemWindows="true"属性を含むレイアウトにImageSwitcherを含めず、代わりにAndroid:fitsSystemWindows="true"属性をinner FrameLayoutに移動して、実際に適合させる必要があるコンテンツを含めます。 (あなたの場合のタイトルテキスト)。残念ながら、これにより、ImageSwitcher/ViewPagerのビューがシステムウィンドウによってわずかに途切れる可能性がありますが、画像が背景画像のように使用される場合でも、あまり問題にならず、アーティファクトやすべてを維持するよりもはるかに優れています。ナビゲーションが無効になっている場合とされていない場合があるさまざまな寸法/スタイル(現在選択されている回答など)。

これが誰かを助けることを願っています!

7
Rican7

私の解決策は、横長モードで半透明のナビゲーションを無効にすることでした。それでも半透明のステータスバーが表示されますが、ナビゲーションバーが不透明で横向きに重なる問題が修正されます。

res/values-v19/styles.xml(これらの値は私のテーマに含まれています)

<item name="Android:windowTranslucentStatus">true</item>
<item name="Android:windowTranslucentNavigation">@bool/translucentNavBar</item>

res/values-v19/bools.xml(半透明ナビゲーションを有効にする)

<bool name="translucentNavBar">true</bool>

res/values-land-v19/bools.xml(横長の半透明ナビゲーションを無効にする)

<bool name="translucentNavBar">false</bool>

res/values-sw600dp-land-v19/bools.xml(横長のタブレットで半透明ナビゲーションを有効にする)

<bool name="translucentNavBar">true</bool>
39
Tanner Perrien

同様の問題に遭遇しましたが、ViewPagerを使用していなかったため、これが機能しない可能性があります。 Gabeが説明しているように、いくつかのネストを実行することで解決しました。内部のViewGroupのみがfitSystemWindows = "true"であり、背景を表示する外部のViewGroupは半透明のバーの下に拡張できます。次に、方向の変更時に requestFitSystemWindows() も呼び出します。繰り返しますが、ViewPagerが複雑になっている可能性があり、私の解決策は機能しませんが、これが役立つことを願っています。

3
danh32

画像と fitsSystemWindows を含むビューグループ内に別のViewGroupを配置してtrueにします

2
Gabe