web-dev-qa-db-ja.com

マテリアルデザインの透明なActionBar

アプリのページにアクセスしたときに新しいGoogle Playストアにあるような、透明なアクションバーでアクティビティを作成する方法を誰かが知っているかどうか知りたいです。

スクロールや透明から単色の背景への切り替えは気にせず、アクションバーが透明である必要があります。

ありがとう。

36
user3184899
<item name="colorPrimary">@Android:color/transparent</item> 

これにより、Lollipopデバイスで例外が発生します。 colorPrimaryは不透明でなければなりません。

スタイルを使用してアクションバーをスタイリッシュに:

<style name="ThemeActionBar"
        parent="Widget.AppCompat.Light.ActionBar.Solid">
        <item name="Android:background">@null</item>
        <!-- Support library compatibility -->
        <item name="background">@null</item>
</style>

そして、あなたのテーマに以下を含めてください:

<item name="Android:actionBarStyle">@style/ThemeActionBar</item>
<item name="Android:windowActionBarOverlay">true</item>
<!-- Support library compatibility -->
<item name="actionBarStyle">@style/ThemeActionBar</item>
<item name="windowActionBarOverlay">true</item>
40
Thiago

必要なのは<item name="colorPrimary">@Android:color/transparent</item>そして、次のようにアプリテーマでwindowActionBarOverlayをtrueに設定します。

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light">
        <item name="Android:textColorPrimary">@color/my_text_color</item>
        <item name="colorPrimary">@Android:color/transparent</item>
        <item name="windowActionBarOverlay">true</item>
    </style>

</resources>

最終結果は次のようになります。

final result of code

24
Cristian Gomez

1)AppBarLayoutエレベーションプロパティを0dpに設定します。

app:elevation = "0dp"

2)Toolbar背景色を透明に設定します。

Android:background = "@ Android:color/transparent"

Xml全体は次のようになります。

<Android.support.design.widget.AppBarLayout
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:theme="@style/AppTheme.AppBarOverlay"
    app:elevation="0dp">

    <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.v7.widget.Toolbar>
</Android.support.design.widget.AppBarLayout>

enter image description here

8
Mohit Charadva

透明アクションバー

values/styles.xml:

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

<style name="AppTheme.ActionBar.Transparent" parent="AppTheme">
    <item name="Android:windowContentOverlay">@null</item>
    <item name="windowActionBarOverlay">true</item>
    <item name="colorPrimary">@Android:color/transparent</item>
</style>

<style name="AppTheme.ActionBar" parent="AppTheme">
    <item name="windowActionBarOverlay">false</item>
    <item name="colorPrimary">@color/default_yellow</item>
</style>

values-v21/styles.xml:

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

<style name="AppTheme.ActionBar.Transparent" parent="AppTheme">
    <item name="colorPrimary">@Android:color/transparent</item>
</style>

<style name="AppTheme.ActionBar" parent="AppTheme">
    <item name="colorPrimaryDark">@color/bg_colorPrimaryDark</item>
    <item name="colorPrimary">@color/default_yellow</item>
</style>

AndroidManifest.xmlでこれらのテーマを使用して、どのアクティビティに透明または色付きActionBar

<activity
            Android:name=".MyTransparentActionbarActivity"
            Android:theme="@style/AppTheme.ActionBar.Transparent"/>

    <activity
            Android:name=".MyColoredActionbarActivity"
            Android:theme="@style/AppTheme.ActionBar"/>
6

enter image description here

<style name="AppTheme" parent="Theme.MaterialComponents">
    <item name="Android:navigationBarColor" tools:targetApi="Lollipop">@color/color_primary
    </item>
    <item name="Android:statusBarColor" tools:targetApi="Lollipop">@color/color_primary</item>
    <item name="colorPrimary">@color/color_primary</item>
    <item name="colorPrimaryDark">@color/color_primary_dark</item>
    <item name="colorAccent">@color/color_accent</item>
</style>

<style name="MainTheme" parent="AppTheme">
    <item name="actionBarStyle">@style/MyTheme.ActionBar</item>
    <item name="Android:windowTranslucentStatus">true</item>
    <item name="Android:windowTranslucentNavigation">true</item>
</style>

<style name="MyTheme.ActionBar" parent="Widget.AppCompat.ActionBar">
    <item name="elevation" tools:targetApi="Lollipop">0dp</item>
    <item name="background">@color/semi_transparent</item>
</style>
</resources>


<resources>
<color name="color_primary">#212121</color>
<color name="color_primary_dark">@Android:color/black</color>
<color name="color_accent">#4285F4</color>
<color name="semi_transparent">#66000000</color>
</resources>
4
kreker

実際にそれを行う方法もあります。

getWindow().requestFeature(Window.FEATURE_ACTION_BAR_OVERLAY);
mActionBar.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
mActionBar.setElevation(0);
3
Lemberg

これは私のために働いた

getWindow().setFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION, WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);   
getSupportActionBar().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
1
John Joe