Android notification bar immersive/transparent complete solution, incomplete root solution

Source: Internet
Author: User

Android notification bar immersive/transparent complete solution, incomplete root solution

Reprinted please indicate the source: http://www.cnblogs.com/cnwutianhao/p/6640649.html

 

References: https://github.com/ljgsonx/adaptiveStatusBar

 

Google added a translucent interface style to Android 4.4 and introduced the Material Design concept in Android 5.0.

The addition of these styles makes the originally rigid, ugly, and inconsistent App color notification bar more friendly, eye-catching, and user experience more friendly.

 

The author has been working on Japanese projects all the year round and is famous for its simple interface and powerful functions. Recently, the customer asked for some changes in the UI to make the App look more friendly to users. So I mentioned the issue in the notification bar after Android 4.4.

Articles on the notification bar on the Internet are overwhelming, immersive, and translucent... It will be a drag-and-drop. There are also some Android experts who have also written similar articles, but can you see that article? For a long time, the programmer is tired enough. How can I see the time when you are there? It's a waste of time and a pile of spam articles.

 

This article puts an end to redundancy, which is the simplest and most practical. It is not the amount of code, but the least code to write the most beautiful program.

 

The project corresponding to the article has been uploaded to Github. Welcome to Star and Fork. Address: https://github.com/cnwutianhao/ImmersiveDemo

 

First, go to the Gif image. The comparison between Android 4.4 and Android 6.0 after the style effect is achieved.

Android 4.4 Android 6.0

There are two solutions to achieve style effects

① DrawerLayout + Toolbar

② ActionBar

 

Next we will implement them one by one.

① DrawerLayout + Toolbar

Add dependency Library (provided by Google)

compile 'com.android.support:design:25.3.1'

Layout code 1: Use DrawerLayout as the outermost layer and introduce the NavigationView side drawer Control

<?xml version="1.0" encoding="utf-8"?><android.support.v4.widget.DrawerLayout 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/id_drawerlayout"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context="com.tnnowu.android.demo17032801.MainActivity">    <include layout="@layout/content_layout" />    <android.support.design.widget.NavigationView        android:id="@+id/id_navigationview"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_gravity="left"        app:itemTextColor="@color/c_light_gray3" /></android.support.v4.widget.DrawerLayout>

Layout Code 2: Nested Toolbar

<? Xml version = "1.0" encoding = "UTF-8"?> <LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android" xmlns: app = "http://schemas.android.com/apk/res-auto" android: layout_width = "match_parent" android: layout_height = "match_parent" android: orientation = "vertical"> <android. support. v7.widget. toolbar android: id = "@ + id/toolbar" android: layout_width = "match_parent" android: layout_height = "wrap_content" android: background = "# 30469b" android: PaddingTop = "@ dimen/toolbar_padding_top" app: popupTheme = "@ style/ThemeOverlay. appCompat. light "app: theme =" @ style/ThemeOverlay. appCompat. dark. actionBar "> <TextView android: layout_width =" wrap_content "android: layout_height =" wrap_content "android: layout_gravity =" center "android: text =" ToolBar "android: textSize = "20sp"/> </android. support. v7.widget. toolbar> <! -- Content display layout --> <RelativeLayout android: layout_width = "match_parent" android: layout_height = "match_parent"> <Button android: id = "@ + id/goToActionBar" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_centerInParent = "true" android: text = "switch to ActionBar"/> </RelativeLayout> </LinearLayout>

Style: No ActionBar

<style name="AppThemeNoActionBar" 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></style>

Main program code: In addition to initializing the DrawerLayout, NavigationView, Toolbar Control (initViews () in onCreate () add the mobile phone system version judgment and the corresponding style adaptation initImmersive ()

private void initViews() {        mDrawerLayout = (DrawerLayout) findViewById(R.id.id_drawerlayout);        mNagigationView = (NavigationView) findViewById(R.id.id_navigationview);        mNagigationView.inflateHeaderView(R.layout.header_nav);        mNagigationView.inflateMenu(R.menu.menu_nav);        mToolbar = (Toolbar) findViewById(R.id.toolbar);        mBtn = (Button) findViewById(R.id.goToActionBar);        mToolbar.setTitle("");        if (mToolbar != null) {            setSupportActionBar(mToolbar);        }        ActionBarDrawerToggle mActionBarDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, mToolbar, R.string.open, R.string.close);        mActionBarDrawerToggle.syncState();        mDrawerLayout.setDrawerListener(mActionBarDrawerToggle);        mBtn.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                startActivity(new Intent(MainActivity.this, DemoActionBarActivity.class));            }        });    }
Private void initImmersive () {if (Build. VERSION. SDK_INT> = Build. VERSION_CODES.KITKAT) {WindowManager. layoutParams localLayoutParams = getWindow (). getAttributes (); localLayoutParams. flags = (WindowManager. layoutParams. FLAG_TRANSLUCENT_STATUS | localLayoutParams. flags); if (Build. VERSION. SDK_INT <Build. VERSION_CODES.LOLLIPOP) {// extend the top of the sidebar to the status bar mDrawerLayout. setFitsSystemWindows (true); // extend the top of the home page to the status bar. Although the default value is false, it is tested that the setting of mDrawerLayout must be displayed in DrawerLayout. setClipToPadding (false );}}}

In this way, the Drawlayout + Toolbar implements the style change.

 

② ActionBar

Layout code

<? Xml version = "1.0" encoding = "UTF-8"?> <LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android" android: layout_width = "match_parent" android: layout_height = "match_parent" android: background = "@ color/colorPrimary" android: fitsSystemWindows = "true" android: orientation = "vertical"> <! -- Content display layout --> <RelativeLayout android: layout_width = "match_parent" android: layout_height = "match_parent" android: background = "@ color/c_light_white"> <Button android: id = "@ + id/goBack" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_centerInParent = "true" android: text = "back to ToolBar"/> </RelativeLayout> </LinearLayout>

Style: With ActionBar

<style name="AppThemeActionBar" parent="Theme.AppCompat.Light.DarkActionBar">    <!-- Customize your theme here. -->    <item name="colorPrimary">@color/colorPrimary</item>    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>    <item name="colorAccent">@color/colorAccent</item></style>

Main program code:

public class DemoActionBarActivity extends AppCompatActivity {    private Button mBtn;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main_actionbar);        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {            WindowManager.LayoutParams localLayoutParams = getWindow().getAttributes();            localLayoutParams.flags = (WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS | localLayoutParams.flags);        }        initView();    }    private void initView() {        mBtn = (Button) findViewById(R.id.goBack);        mBtn.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                finish();            }        });    }}

In this way, the ActionBar changes the style.

 

No redundant code. Why don't you try the code that is used for daily projects.

 

Follow my Sina Weibo website to learn more about Android development!
Focus on science and technology critics, learn about science and technology, innovation, education, and maximize human wisdom and imagination!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.