Use of Toolbar and Theme for new features of Android5.x

Use of Toolbar and Theme for new features of Android5.x

 

After Android, Google strongly promoted the Material Design and intended to unify the previous Android style chaos. In the previous blog, we learned how to use the RecyclerView, CardView, and Palette of the new Android5.x control. This article introduces the use of Toolbar and Theme in the new features of Android5.x.

Note:To use the Toolbar and Theme in Android5.x, You need to introduce the following configuration under the build. gradle file of your project:

dependencies {    compile fileTree(dir: 'libs', include: ['*.jar'])    compile 'com.android.support:appcompat-v7:22.2.0'}

Toolbar

Are you still worried that the Android ActionBar text cannot be set at will? Are you still worried that the ActionBar cannot be customized to add your own layout? Now let us know the good news. When you see this article, you don't have to worry about it. Google launched a Toolbar after Android5.0 to completely replace the previous Actionbar. The appearance of the Toolbar solves the various restrictions of the Actionbar, And the Toolbar can be fully customized and configured. We will learn how to use Toolbar from the following points:

Use Toolbar to configure common controls in Theme Toolbar to set the basic usage of custom Toolbar of Toolbar

We will learn how to use Toolbar step by step from the following points:

Style Layout Activity (CODE) Style

To use Toolbar in your Activity, you must modify the theme style in the styles. xml file in the project. The default format is as follows:

The attributes are not explained, and the annotations are clear. Let's take a look at how Toolbar uses these topics?

Set the Toolbar in activity_main.xml to the following:

Compared with the preceding Toolbar configuration, only such a line of code is added here.

android:background=?attr/colorPrimary

Set the background attribute for the Toolbar. the following attributes are used in the styles. xml file.

 
   
  
   
@ Color/accent_material_dark
  

Let's take a look at the following configurations!

The effect is somewhat improved. Let's continue to discover the advantages of Toolbar!

Common control settings in Toolbar

Does the Toolbar have all the functions of Actionbar? Without a doubt, let's look at the Code:

Toolbar = findView (R. id. toolbar); setsuppactionactionbar (toolbar); getsuppactionactionbar (). setDisplayShowTitleEnabled (false); toolbar. setTitle (main title); toolbar. setSubtitle (Subtitle); toolbar. setLogo (R. drawable. ic_launcher); toolbar. setNavigationIcon (android. r. drawable. ic_input_delete );

You can set the Title, Subtitle, and Logo NavigationIcon In the Toolbar ).

Note:If you want to use toolbar. setTitle ("Main title"); To set the title of a Toolbar, you must call the following code before calling it:

getSupportActionBar().setDisplayShowTitleEnabled(false);

The above code is used to hide the default Title of the system.

So can Toolbar use the Menu function? The answer is yes. Let's take a look at the Toolbar for loading the menu below.

How can I add a click event to each Item in the menu? Toolbar provides the following methods:

Activity inherits the OnMenuItemClickListener interface of the Toolbar.

public class MainActivity extends AppCompatActivity implements Toolbar.OnMenuItemClickListener

// Implement the toolbar interface. setOnMenuItemClickListener (this); @ Override public boolean onMenuItemClick (MenuItem item) {switch (item. getItemId () {case R. id. action_edit: Toast. makeText (this, search button, Toast. LENGTH_SHORT ). show (); break; case R. id. action_share: Toast. makeText (this, share button, Toast. LENGTH_SHORT ). show (); break;} return false ;}

At this point, the addition of the Toolbar Control is almost complete. Let's take a look at the effect as follows:

Is it amazing? We have not used a custom Toolbar yet? So how to use it?

Custom Toolbar

In fact, Toolbar is a container control that inherits ViewGroup. The implication is that we can add our own layout in the Toolbar. View code

:

In this way, we can layout the Toolbar as needed. The title cannot be centered. If you have a Toolbar with special requirements, you can make up your own brains to achieve the desired results!

Android5.x Material Design Theme Configuration

The road to the Material Design style is always far away, but it cannot block the strength of our learning. It is not enough to simply use the Toolbar. In addition to the Toolbar style, we can also control the style of many Android controls by setting Theme themes. Directly upload an image.

The theme configuration for the above effects is as follows:

1. colorPrimary: background color of the Toolbar navigation bar.
2. colorPrimaryDark: the background color of the status bar. Note that only mobile phones above Android5.0 are supported.
3. textColorPrimary: default color of the font of the entire Activity.
4. android: windowBackground: the form color of the current Activity.
5. colorAccent: CheckBox, RadioButton, SwitchCompat, and other controls. Click the selected color.
6. colorControlNormal: Color of default states such as CheckBox, RadioButton, and SwitchCompat.
7. colorButtonNormal: The color of the Button in the default state.
8. editTextColor: The font color of the default EditView input box.