टूलबार पारदर्शी

Question

create_account.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent" 
android:layout_height="match_parent" 
android:fitsSystemWindows="true" 
tools:context="io.sleeko.board.CreateAccountActivity"> 

<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> 

<include layout="@layout/content_create_account" /> 

<android.support.design.widget.FloatingActionButton 
    android:id="@+id/fab" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_gravity="bottom|end" 
    android:layout_margin="@dimen/fab_margin" 
    android:src="@android:drawable/ic_dialog_email" /> 

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

बनाओ मैं ऊपर ToolBar पारदर्शी बनाने के लिए की जरूरत है। ताकि हम पृष्ठभूमि छवि देख सकें। मैंने विभिन्न तरीकों का प्रयास किया है। लेकिन सही समाधान नहीं मिला।

कृपया help.thanks

Answer 1

कि प्रयास करें:

<android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="?attr/actionBarSize" 
     android:background="@android:color/transparent" 
     app:theme="@style/ThemeOverlay.AppCompat.ActionBar" /> 

और निकालें कि अंत टैग के साथ:

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

लेकिन यह पूर्ण पारदर्शी, आप रंग है उपयोग कर सकते हैं नहीं बनाते हैं #93000000 जैसे पारदर्शिता तो यह इस तरह होगा:

<android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="?attr/actionBarSize" 
     android:background="#93000000" 
     app:theme="@style/ThemeOverlay.AppCompat.ActionBar" /> 

Answer 2

अधिकांश बार हम टूलबार पारदर्शी होना चाहते हैं क्योंकि हम इसके पीछे सामग्री दिखाना चाहते हैं। समस्या यह है कि टूलबार के पीछे सामग्री के रंग टूलबार तत्व/पाठ (उदाहरण के लिए ऊपर/पीछे तीर) के रंग से टकरा सकते हैं।

इसी कारण से आप कई कार्यान्वयन में देखेंगे कि टूलबार वास्तव में पारदर्शी नहीं है बल्कि ढाल के साथ पारदर्शी है।

आप अगले कोड के साथ इस प्राप्त कर सकते हैं:

<?xml version="1.0" encoding="utf-8"?> 

<android.support.v7.widget.Toolbar 
    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/toolbar" 
    android:layout_width="match_parent" 
    android:layout_height="?attr/actionBarSize" 
    android:background="@drawable/background_toolbar_translucent" /> 

background_toolbar_translucent.xml

<?xml version="1.0" encoding="utf-8"?> 

<shape 
    xmlns:android="http://schemas.android.com/apk/res/android"> 

    <gradient 
     android:angle="270" 
     android:endColor="@android:color/transparent" 
     android:startColor="@color/black_alpha_40"/> 
</shape> 

colors.xml

<color name="black_alpha_40">#66000000</color> 

आप ढाल पर विभिन्न मूल्यों के साथ खेल सकते हैं, जो मैंने पाया है वह है कि सफेद तत्वों के लिए, काला 40% ठीक काम करता है।

एक और चीज जो आप करना चाहते हैं टूलबार के शीर्षक को छिपाना है।

getSupportActionBar().setDisplayHomeAsUpEnabled(true); 

और ऊपर affordance दिखाने ...

getSupportActionBar().setDisplayShowTitleEnabled(false); 

चिंता मत करो अगर आप लेआउट पूर्वावलोकन पैनल में कुछ इस तरह दिखाई ...

यह बहुत अलग दिखता है वास्तव में सामग्री को ओवरलैप करने पर:

Answer 3

मेरा समाधान यहां है।

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

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