Toolbar and appcompatacitivity for immersive statusbar effects

Source: Internet
Author: User

Toolbar is the new component of the Android SDK API21, here is the official Google Introduction document:

A Standard toolbar to use within application content.

a Toolbar is A generalization of action bars  for use within application layouts. While a action bar is traditionally part of an  activity ' s  opaque window Decor Controlled by the framework, a Toolbar is placed at any arbitrary level of nesting within a view hierarchy. An application could choose to designate a Toolbar as the action Bar for an Activity using The setactionbar ()  method.

Toolbar supports a more focused feature set than ActionBar. From start-to-end, a toolbar may contain a combination of the following optional elements:

  • A navigation button. This could be a up arrow, navigation menu toggle, close, collapse, done or another glyph of the app ' s choosing. This button should always is used to access other navigational destinations within the container of the Toolbar and its SI Gnified content or otherwise leave the current context signified by the Toolbar. The navigation button is vertically aligned within the Toolbar ' s minimum height , if set.
  • A branded logo image. This could extend to the height of the bar and can is arbitrarily wide.
  • A title and subtitle. The title should is a signpost for the Toolbar's current position in the navigation hierarchy and the content contained th Ere. The subtitle, if present should indicate any extended information on the current content. If an app uses a logo image it should strongly consider omitting a title and subtitle.
  • one or more custom views.  the application may add arbitrary a child of the Toolbar. They would appear at this position within the layout. If a child view ' S
  • an action menu . The menu of actions would pin to the end of the Toolbar offering a few frequent, important or typical actions along with an Optional overflow menu for additional actions. Action buttons is vertically aligned within the Toolbar ' s minimum height , if set.

In modern Android UIs developers should lean more on a visually distinct color scheme for toolbars than on their applicati On icon. The use of application icon plus title as a standard layout are discouraged on API devices and newer.


The main point of the above is that toolbar is the new component of API21, which is mainly used to make up for the shortcomings of Actionbar, which inherit from ViewGroup, free properties including navigation buttons (like up button), logo image, title and sub-headings, One or more custom view, menu.

In particular, an introduction to the "an" application may choose to designate a Toolbar as the action Bar for the Activity using the setActionBar() method. We can use toolbar as Actiobar in any activity, but api21 can only use Setsupportactionbar (), and the corresponding theme is set to Noactionbar (do not suspect that this is the way to do , yes), about toolbar good, I will explain (Mody)

Detailed introduction See sdk/docs/reference/android/widget/toolbar.html


Here's a look at appcompatacitivity

Official introduction: you can add an  actionbar  to your activity when running on API level 7 or higher by extending this class fo R your activity and setting the activity theme to theme.appcompat  or a similar theme.

It is primarily used to provide the ability to add Actionbar to the lower version of the SDK, and to provide topics such as Theme.appcompat (which is Google's recommended theme.material), to ensure that the lower version also gets a higher version.

Detailed introduction See: yoursdkpath/sdk/docs/reference/android/support/v7/app/appcompatactivity.html


Google's new 22.1 library also contains the following components, the biggest feature of which is the ability to use Android:theme in components: to control the styling of components

Appcompatautocompletetextview
Appcompatbutton
Appcompatcheckbox
Appcompatcheckedtextview
Appcompatedittext
Appcompatmultiautocompletetextview
Appcompatradiobutton
Appcompatratingbar
Appcompatspinner
Appcompattextview

After introducing so many good things, we started to get to the point of how to use toolbar and appcompatacitivity to achieve immersive statusbar effects.

First build project with Androidstudio.

The second step is to add a dependent library:


Select Open Module Settings "App" dependency, click the plus sign below to choose ' com.android.support:appcompat-v7:22.1.1 '

Step three: Modify the system's own theme

Modify the original Values/style to:

   <pre name= "code" class= "HTML" ><resources>    <style name= "Actionbartheme" parent= " Theme.AppCompat.NoActionBar ">        <item name=" Windowactionbar ">false</item>        <item name=" Android:windownotitle ">true</item>        <!--toolbar (actionbar) Color--        <item name=" Colorprimary > #673AB7 </item>        <!--window background color-        <item name= "Colorprimarydark" > @android :color/holo_blue_bright</item>    </style></resources>

The reason for this modification is to be able to use toolbar, so we need to set the theme to
Theme.AppCompat.NoActionBar Otherwise, the conflict will cause the program to crash.

Then we create a new folder named:values-v19 in the same directory, which is the effect of providing more than api19+

Where we copy the style file and modify it:

<resources>    <style name= "Actionbartheme" parent= "Theme.AppCompat.NoActionBar" >        <item name= "Windowactionbar" >false</item>        <item name= "Android:windownotitle" >true</item>        < !--Toolbar (Actionbar) Color--        <item name= "colorprimary" > #673AB7 </item>        <!--status bar color---        <item name= "Colorprimarydark" > @android:color/holo_blue_bright</item>    </style></ Resources>
The status bar color will only take effect if it is above api19.

The fourth step is to create the layout file:

<?xml version= "1.0" encoding= "Utf-8"? ><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= "@android: Color/holo_blue_bright"    Android : theme= "@style/themeoverlay.appcompat.dark"    android:popuptheme= "@style/themeoverlay.appcompat.dark"    android:minheight= "Attr/actionbarsize" >   </android.support.v7.widget.Toolbar>

<?xml version= "1.0" encoding= "Utf-8"? ><linearlayout    xmlns:android= "http://schemas.android.com/apk/ Res/android "    android:orientation=" vertical "    android:layout_width=" fill_parent "    android:layout_ height= "Fill_parent"    android:fitssystemwindows= "true" >    <include layout= "@layout/toobar" ></ include>    <android.support.v7.widget.appcompatcheckedtextview        android:layout_width= "Fill_parent"        android:layout_height= "wrap_content"        android:text= "Hello World, myactivity"/></linearlayout>


Fifth step: Using Appcompatacitivity and toolbar

public class Mainactivity extends Appcompatactivity {    private Toolbar mtoolbar;    @Override    protected void onCreate (Bundle savedinstancestate) {        super.oncreate (savedinstancestate);        Setcontentview (R.layout.activity_main);//        This.getwindow (). Setbackgrounddrawableresource (GetResources (). GetColor (Android. R.color.holo_blue_bright));//        Set the color of the status bar when the version is greater than 4.4 when the        if (Build.VERSION.SDK_INT >= build.version_codes. KITKAT) {            Systembartintmanager Tintmanager = new Systembartintmanager (this);            Tintmanager.setstatusbartintenabled (true);            Tintmanager.setstatusbartintresource (Android. r.color.holo_blue_bright);        }        Mtoolbar = (Toolbar) Findviewbyid (R.id.toolbar);        Mtoolbar.settitle ("main title");//The text of the title must be before Setsupportactionbar, otherwise it will be invalid        setsupportactionbar (mtoolbar);    }}
In this way we can achieve the immersion effect, in the project I used an open source project Systembartintmanager, this resource will be posted in the source code.

Then post the running effect:


You may think that our quest is over, but it's not done yet. For this toolbar we have not yet toyed with, see it inherited from the ViewGroup, so I was curious to add a sub-view, found to be able to run successfully


<?xml version= "1.0" encoding= "Utf-8"? ><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= "@android: Color/holo_blue_bright"    Android : theme= "@style/themeoverlay.appcompat.dark"    android:popuptheme= "@style/themeoverlay.appcompat.dark"    android:minheight= "Attr/actionbarsize" >    <textview        android:layout_width= "Match_parent"        android:layout_height= "40DP"        android:text= "123"/>  </android.support.v7.widget.Toolbar>
The title bar actually shows 123, before setting the title to expire, and then I put in a new linearlayout, can also be correctly layout, if there is a sub-layout will make the Settitile method invalid, and The Mtoolbar.setnavigationicon method is not affected by it.

If we want to simulate actionbar above the navigation buttons like upward such effects, need to be configured in Java code mtoolbar.setnavigationicon,xml will be due to the API version of the problem is not resolved. If you do not want to use Actionbar, we can comment out the toolbar, and the status bar is as controllable as the color. Please specify the source of the reprint

Source Address: Https://github.com/jelychow/demo
If you have any questions, please leave a message or correct me.


Toolbar and appcompatacitivity for immersive statusbar effects

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.