Przezroczysty pasek powiadomień i nawigacyjny

Wraz z wydaniem Androida 4.4 Google wprowadziło nowe możliwości interfejsu użytkownika, Dzięki temu aplikacje mogą wyglądać atrakcyjniej. Jedną z tych opcji jest właśnie przezroczysty pasek powiadomień oraz nawigacyjny. Aby uzyskać przezroczysty pasek powiadomien trzeba zastosować: windowTranslucentStatusa oraz windowTranslucentNavigation — dla paska nawigacyjnego. W tym wpisie pokaże Ci jak zrobić przezroczysty pasek powiadomień i nawigacyjny.

Półprzezroczysty pasek powiadomień

Dla wersji KitKat nie będzie to w pełni przezroczysty pasek tylko gradient. Natomiast od wersji Lollipop można powiedzieć, że będzie to pasek w pełni przezroczysty. Dla androida 4.4 musimy stworzyć plik ze stylem v19 i w nim dodać:

<item name="android:windowTranslucentStatus">true</item>

Cały plik będzie wyglądać tak:

<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>
        <item name="android:windowTranslucentStatus">true</item>
    </style>
</resources>

Od wersji API 21 mamy więcej możliwości na wygląd paska:

  1. Ustawienie na sztywno przezroczystości tak ja wyżej.
  2. Innym sposobem jest dodanie innego atrybutu:
    <item name="android:statusBarColor">@android:color/transparent</item>

    W tej metodzie możemy też zmieniać kolor paska na taki, jaki chcemy niekoniecznie na przezroczysty.

  3. Jeśli korzystamy z Toolbara to możemy zrobić to z poziomu kodu Java:
    toolbar.setBackgroundColor( getResources().getColor(android.R.color.transparent) );

Półprzezroczysty pasek nawigacyjny

Możemy to ustawić w sposób analogiczny jak wyżej, przy czym musimy zwracać uwagę na style dla odpowiedniej wersji Androida. W wersji API 19 nie mamy możliwości zmiany koloru paska, ale możemy ustawić przezroczystość do tego służy atrybut:

<item name="android:windowTranslucentNavigation">true</item>

A dla zmiany koloru w wersji >21:

<item name="android:navigationBarColor">@android:color/transparent</item>

Efekt wygląda następująco:
Przezroczysty pasek powiadomień i nawigacyjny.

Co dalej?

  • Zapisz się na newsletter aby otrzymywać jeszcze więcej materiałów
  • Polub stronę MYENV na Facebooku oraz śledź mnie na Twitterze
  • Zachęcam do komentowania i pisania propozycji tematów, o których chcesz przeczytać
  • Poleć ten wpis za pomocą poniższych przycisków. Będę Ci za to bardzo wdzięczny 🙂
  • Życzę Ci miłego dnia i miłego kodowania 🙂
Menu