Basic knowledge of Android [project training-achieve two-level navigation on the main interface] [3], android Training

Basic knowledge of Android [project training-achieve two-level navigation on the main interface] [3], android Training

[This project training is a comprehensive exercise of basic Android knowledge. Note: some pictures and materials will be used in the project and they will be organized at will. A resource will be uploaded later, includes the basic functions of this item, as well as image materials]

[Project title]: Comprehensive Case Study of campus ordering App design [Objective]

After the welcome page is displayed, the main interface of the app should be displayed. According to the planning in [uidesign Guide], the main interface should use up or down two levels of tag navigation. This is a troublesome part of app development.

1. First, let's take a look at the final effect. This is a good practice:

The main interface is displayed by default. The lower part is the main navigation, and the upper part is the secondary navigation. The "discount promotion" page is opened by default.

Sales discounts are divided into "Today's activity" and "Today's discount ". The activities include discounts and other forms of "buy one get one free, send dessert, and so on". [This part of the function should be used in project training in Phase II, only business clients can be designed and developed]

The user has not logged on and cannot view the bill information. The bill has not been paid and history. Historical bills are paid and canceled.

This is equivalent to a relatively complete main interface, which contains a lot of functions. The functions in the project design guidance are basically covered here.

2. Let's talk about the code in detail below. Because there are many main interface codes, this part will be written in multiple sections.

The first is the title style problem: there are many ways to change the title style, which use the method of modifying the style:

2.1 This is styles. The style-related code of the xml type. Note that the background color and font color of the ActionBar are modified.

<!-- Application theme. -->    <style name="AppTheme" parent="AppBaseTheme">        <item name="android:actionBarStyle">@style/my_actionbar_style</item>    </style>    <style name="my_actionbar_style" parent="@android:style/Widget.Holo.Light.ActionBar">        <item name="android:background">#993333</item>        <item name="android:titleTextStyle">@style/my_actionbar_title</item>    </style>    <style name="my_actionbar_title" parent="@android:style/TextAppearance.Holo.Widget.ActionBar.Title">        <item name="android:textColor">#CCCCCC</item>        <item name="android:textSize">14sp</item>    </style>

2.2 There is a menu on actionBar, and its code file is as follows:

This file is main. Xml is located under res/menu.

<Menu xmlns: android = "http://schemas.android.com/apk/res/android"> <item android: id = "@ + id/menu_shopcat" android: orderInCategory = "100" android: showAsAction = "always" android: icon = "@ drawable/shopcat" android: title = "Shopping Cart"/> <item android: id = "@ + id/menu_more" android: orderInCategory = "101" android: showAsAction = "always" android: icon = "@ drawable/more"> <menu> <group> <item android: id = "@ + id/menu_info" android: orderInCategory = "201" android: title = "Personal Information" android: icon = "@ drawable/role"/> <item android: id = "@ + id/menu_setting" android: orderInCategory = "202" android: title = "system settings" android: icon = "@ drawable/set"/> <item android: id = "@ + id/menu_exit" android: orderInCategory = "203" android: title = "Exit System" android: icon = "@ drawable/exit"/> </group> </menu> </item> </menu>

First come here.