Android native Android ActionBar

Content of this article

• About ActionBar
• Necessary
• Project structure
• Environment
• Demo One: Action Bar shows hidden
• Demo Two: Action Item display menu options
• Demo Three: Action Home enable "Back/Up" program icon navigation
• Demo Four: Action View display UI component

If you want to use Actionbarsherlock, it's a good idea to study the native Android ActionBar first. Recently intends to use Android to write an APP, using a three-party library Actionbarsherlock, I was just getting started with Android, to achieve some common features and effects on Android has a general understanding ~ but the results are Actionbarsherlock make very uncomfortable, originally thought should not be very difficult ah, after all, programming also has years (although I am engaged in. NET C #, but Java and C # have 90% similarity, Microsoft makes C # People, is the original Java, C # in the 1.0 version of the Very bad, until the 2.0 version was greatly improved. I didn't use Java as a project, but I didn't know anything about Java ... ), can be searched for some information and examples, feel, simple to make a line, but to achieve the degree of the project, or complex point, to now can not understand actionbarsherlock~

After a night of reflection, I found that I still need to start from scratch, to study the native Android ActionBar, then just a glance ... As a result, I also solved another problem. We know that when you write a computer application, the page is initialized, and so does Android, but I'm not sure if, for example, Tab, or Viewpager, how to initialize each page, or every Pager. Don't tell me Fragment, I'm talking about the code of implementation.

This article mainly demonstrates the use of native Android ActionBar. Including:

• Action Bar shows hidden
• Action Item Display menu options
• Action Home enable the "Back/Up" program icon navigation
• Action View Display UI component

But before formally explaining some of the features that native ActionBar implements, let's take a look around.

Download Demo (download error, please leave a message!) ) About Actionbar

The "Action Bar" is the most important design element for Android apps. It usually stays at the top of the screen all the time the app is running.

The main purpose of the action Bar is to:

• Highlights important actions, such as new and search, and is easy to use.
• Provides a unified navigation and view switching experience within the app.
• Collect less-used features into the more Actions menu to reduce clutter on the interface.
• Provide a space for your app to showcase its features.

If you're a novice in writing Android apps, be aware that the action Bar is the most important design element to implement. Follow the instructions below to design your app to achieve a unified interface experience with Android core apps.

For most applications, the action bar can be split into 4 different functional areas.

Figure 1 Activity Bar

• 1. App icon

The app icon is the app's identity. Place your own logo in the location of the app icon.

Note: If the application is not at the top level, then place a left arrow on the left side of the icon, indicating the "up" button so that the user can go back to the upper level of the interface. For more details on the "Up" button, see the Navigation section.

• 2. View Control

If your APP displays data in several different views, the View control area allows the user to switch views. You can use a drop-down menu or a label control to implement it.

But if your APP does not have multiple views, you can display non-actionable content, such as headlines or branding information, here.

• 3. Operation Button

Displays the heaviest action in the app. If the icon doesn't fit, it's automatically moved into the more Actions menu.

• 4. More Operations

Place the low-frequency operation in this menu.

It is important to differentiate between these 4 regions. For example, should be in the "action button" area to put those operations, the most common is "search", you can not use the frequency of such a high operation "hidden" in a very deep position, the user must curse you every day ~ For example, in the "more operations" area, the use of low-frequency operation, can be used even lower, Also carefully arrange the order of those operations ~

Reference Andriod design principles for the ActionBar of the Action Bar

Necessary

ActionBar is one of the important updates for Android 3.0. You must specify the version of the app in the SDK configuration of the androidmanifest.xml file to be greater than one (version number of Android 3.0). In this demo, the value ofminsdkversion must be higher than, as follows:

< Manifest xmlns:android = "Http://schemas.android.com/apk/res/android"

     Package = "Com.example.nativeactionbardemo"

    Android:versioncode = "1"

    Android:versionname = "1.0" >

    <!--use ActionBar minsdkversion at least---

    < USES-SDK

        android:minsdkversion = "+"

        android:targetsdkversion = "+" />

    < Application

        Android:allowbackup = "true"

        Android:icon = "@drawable/ic_launcher"

        Android:label = "@string/app_name"

        Android:theme = "@android: Style/theme.holo" >

        < Activity

            Android:name =". Mainactivity "

            Android:label = "@string/app_name" >

            < Intent-filter >

                < Action Android:name = "Android.intent.action.MAIN" />

                < category Android:name = "Android.intent.category.LAUNCHER" />

            </ Intent-filter >

        </ Activity >

        < Activity

            Android:name =". Actionbartest "

            Android:label = "@string/app_name"

            Android:theme = "@android: Style/theme.holo.light" >

        </ Activity >

        < Activity

            Android:name =". Actionitemtest "

            Android:label = "@string/app_name" >

        </ Activity >

        < Activity

            Android:name =". Firstactivity "

            Android:label = "@string/app_name" >

        </ Activity >

        < Activity Android:name =". Secondactivity ">

        </ Activity >

        < Activity Android:name =". Actionhometest ">

        </ Activity >

        < Activity Android:name =". Actionviewtest ">

        </ Activity >

    </ Application >

</ Manifest >

When you specify minsdkversion =14 , the lower version of the real machine cannot be seen in Eclipse Debug. Although there are ways to do this, this is not covered in the scope of this article. It seems that Android 4.0 or higher phones are already commonplace. But if you use the Actionbarsherlock library and add it to your project, there's no problem.

Also, note that the application section sets the theme.

Project structure

Figure 2 Project Structure Figure 3 Program main interface

Environment

• Windows R2 64-bit
• Eclipse ADT v22.6.2,android 4.4.2 (API 19)
• SAMSUNG gt-8618,android OS 4.1.2

Demo One: Action Bar shows hidden

Figure 4 ActionBar Show hidden

When you click the "Hide ActionBar" button, the ActionBar will be hidden.

Demo Two: Action Item display menu options

Figure 5 Show menu options

There are three kinds of menus on the ActionBar: Radio menu, normal menu, and check menu. You can change the font size and color.

Demo Three: Action Home enable "Back/Up" program icon navigation

Figure 6 Enabling the "Back/Up" program icon navigation

• The first figure is the first Activity;
• In the second figure, when you click on the "Start second" button in the first diagram, you will go to the second Activity and see the word "start third";
• In the third diagram, when you click on the "Start third" button in the second diagram, you will go to the next Activity with the same interface as the demo two. The only difference is that the "back/Up" feature has been added;
• In the fourth figure, when you click on "program icon Navigation" (also with a left arrow), you will return to the first diagram.

Demo Four: Action View display UI component

ActionBar can display normal UI components in addition to the normal Action Item.

There are two ways to add an Action View on ActionBar:

• When you define an action Item, use the android:actionviewclass property to specify the implementation class for the action View.
• When you define an action Item, use the android:actionlayout property to specify the view resource for the action view, which is the XML file.

Figure 7 Displaying the UI components

The core code is as follows:

<? XML version = "1.0" encoding = "Utf-8"? >

< Menu xmlns:android = "Http://schemas.android.com/apk/res/android" >

    < Item

        Android:id = "@+id/search"

        Android:actionviewclass = "Android.widget.SearchView"

        android:orderincategory = "+"

        android:showasaction = "Always"

        Android:title = "@string/menu_settings" />

    < Item

        Android:id = "@+id/progress"

        Android:actionlayout = "@layout/clock"

        android:orderincategory = "+"

        android:showasaction = "Always"

        Android:title = "@string/menu_settings" />

</ Menu >

Description: The menu with theID of Search , which specifies the Android.widget.SearchView class, the menu withID Progress , The clock.xml file is specified.

Download Demo