web-dev-qa-db-ja.com

Appcompat v21ツールバーの標高事前ロリポップ

まず、この質問は以前に聞かれたことがあることを知っていますが、まだ回答されていません。誰かが私に答えてくれることを願っています。

私のアプリケーションでは、Appcompat_v7（API 21）のツールバーを使用しています。これは私のコードです：

<Android.support.v7.widget.Toolbar
    style="@style/DarkActionbarStyle"
    Android:id="@+id/toolBar"
    Android:layout_width="match_parent"
    Android:layout_height="@dimen/actionbar_height" />

そして、これは私が使用するツールバースタイルです。

<style name="DarkActionbarStyle" parent="@style/Widget.AppCompat.Toolbar">
    <item name="Android:background">?attr/colorPrimary</item>
    <item name="titleTextAppearance">@style/ActionBarTitle</item>
    <item name="Android:elevation">2dp</item>
    <item name="popupTheme">@style/ThemeOverlay.AppCompat.Light</item>
    <item name="theme">@style/ThemeActionBarDark</item>
</style>

<style name="ThemeActionBarDark" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="actionBarItemBackground">@drawable/btn_dark_orange</item>
    <item name="selectableItemBackground">@drawable/btn_dark_orange</item>
</style>

問題は、ロリポップ以前では標高が機能しないことです。 だから私の質問は、Lollipop以前のデバイスのツールバーの下に影を付けることは可能ですか？

androidtoolbarshadowandroid-5.0-lollipopandroid-appcompat
43
Tristan Vanderaerden

これは私にとって非常にうまくいきました：

<Android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:background="@color/primary"
    card_view:cardElevation="4dp"
    card_view:cardCornerRadius="0dp">

    <Android.support.v7.widget.Toolbar
        Android:id="@+id/toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:background="@color/primary"
        Android:minHeight="?attr/actionBarSize" />

</Android.support.v7.widget.CardView>
75
Islam A. Hassan

ツールバーにCardViewコンテナを使用するのは悪い考えです。

CardViewは、特にローエンドデバイスの場合は重いです。

最良の方法は、グラデーションシャドウビューをツールバーの下に配置することです。シャドウビューは、コーディネーターレイアウトの直接の子である必要があります。すなわち。ツールバーとシャドウビューを含むアプリバーは兄弟である必要があります。

このビューコンポーネントをレイアウトに追加します。

 <View
    Android:id="@+id/gradientShadow"
    Android:layout_width="match_parent"
    Android:layout_height="5dp"
    Android:background="@drawable/toolbar_shadow"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    app:layout_collapseMode="pin"/>

Drawable toolbar_shadow.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
   Android:shape="rectangle">
<gradient
    Android:angle="90"
    Android:endColor="#33333333"
    Android:startColor="@Android:color/transparent"/>
</shape>

これにより、Lollipop以前のデバイスの問題が解決されます。ただし、Lollipop以上のデバイスではこの影が望ましくないため、Lollipop以上のデバイスでは可視性が失われます。

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Lollipop) {
        findViewById(R.id.gradientShadow).setVisibility(View.GONE);
}

できた.

16
shijin

FrameLayoutとforeground="?android:windowContentOverlay"を使用して、影（標高）を追加し直すことができます。標高属性はLollipop以前ではサポートされていません。したがって、フラグメントコンテナのようなFrameLayoutを使用している場合は、フォアグラウンド属性を追加するだけです。

12
Sniper

CardViewウィジェットメソッドに問題があるため、@ Sniperで言及されているようにFrameLayoutメソッドを使用しました。完璧に機能しています！

使用する必要があるコードスニペットを共有したかっただけです。メインコンテンツが開始するツールバーの下にこれを直接配置します。

<FrameLayout
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:foreground="?android:windowContentOverlay">

そして、次のことを忘れないでください：

</FrameLayout>
7
MegaCookie

アニメーション化および生成された実際のシャドウを作成することができます。 Lollipopで使用されているメソッドは、Froyo以降で使用可能です。シャドウジェネレーションに使用されるハードウェアアクセラレーションは、Honeycombが推測するので利用可能です。仕組みは次のとおりです。

  • lightingColorFilterを0,0に設定して、オフスクリーンビットマップにビューを描画します
  • scriptIntrinsicBlurクラスと標高値を半径として使用して、黒い図形（画面外ビットマップ）をぼかします
  • ビューの下にビットマップを描画します

カスタムの標高属性、影をレンダリングできるカスタムビューを追加し、レンダリングスクリプトと互換性ライブラリ（古いデバイス用）を使用する必要があります。コンパイルやマイナーなパフォーマンスの最適化の問題など、詳細がたくさんあるので、詳細に飛び込むつもりはありません。しかし、それは可能です。

公式のサポートライブラリに影がないのはなぜですか？

  • ビューの境界の外側を自由に描くことができないため、UIフレームワークの変更が必要になります。
  • スムーズなアニメーションには非常に優れたGPUが必要です

見る：

6
Zielony

私はこれを使用しています answer ：

<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:app="http://schemas.Android.com/apk/res-auto"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:orientation="vertical">

<Android.support.v7.widget.Toolbar xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:background="@color/orange"
    Android:titleTextAppearance="@color/White"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />

    <View
        Android:layout_width="match_parent"
        Android:layout_height="5dp"
        Android:background="@drawable/toolbar_shadow" />
</LinearLayout>

toolbar_shadow.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <gradient
        Android:startColor="#3f3f3f"
        Android:endColor="@Android:color/transparent"
        Android:angle="270" />
</shape>
5
Leebeedev

できない API 21（Android Lollipop）の前に昇格属性を使用します。 canただし、たとえばToolbarの下に配置されたカスタムビューを使用して、プログラムでシャドウを追加します。

例えば：

<ImageView
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:layout_below="@+id/toolbar"
        Android:background="@drawable/shadow"/>

影が黒のグラデーションで描画可能な場合。

4
Alessandro Roaro

ツールバーの下に影を表示するには、Google Android Design Support LibraryにあるAppBarLayoutを使用してください。使用方法の例を次に示します。

<Android.support.design.widget.AppBarLayout
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content">
   <Android.support.v7.widget.Toolbar
            Android:layout_height="?attr/actionBarSize"
            Android:layout_width="match_parent"/>
     </Android.support.design.widget.AppBarLayout>

Google Android Design Support Libraryを使用するには、build.gradleファイルに次のように入力します。

 compile 'com.Android.support:design:22.2.0'
2
Michal

手動で影を追加するビューを備えたソリューションは、アクションバーメニューがない限り機能します。その場合、シャドウビューはアクションバーアイコンの前で停止します。

私は、次の線形レイアウト項目として、上部にアプリバーとその下の影のビューを持つ垂直線形レイアウトを持つ方が簡単だと思いますか、私の場合は

<LinearLayout Vertical> 
  <v7 toolbar/>
  <RelativeLayout>
     <View for shadow with alignParent_top= true/>
      ....
  </RelativeLayout>
</LinearLayout>

近い将来のappCompatでこれが修正されることを本当に期待しています。

1
onusopus

もう1つのオプションは、ioschedアプリのような9パッチシャドウを提供する次のライブラリです Android-materialshadowninepatch

0
Osiloke