Android4.0 Launcher source code analysis series (1)

Source: Internet
Author: User
Tags sdo

From today on, I plan to make a series of articles to conduct an in-depth analysis on the Launcher in the latest Android4.0 system, that is, the native desktop program of Android4.0, this will lead Android programmers to study Launcher's design ideas and implementation methods, so that they can use this example to master the world's leading design methods, add some of our new implementations to the program. As we all know, the analysis of some excellent source code is a convenient way to improve the programming level. I hope this series of articles will give you some inspiration. At the same time, we welcome everyone to discuss it with me, my weibo is: http://weibo.com/zuiniuwang/

First, we will analyze the Launcher layout as a whole. Let's have an understanding of the overall structure of Launcher by viewing Launcher. xml and using the combination of hierarchyviewer layout viewing tool. Use hierarchyviewer to complete the entire desktop as follows:


 

650) this. width = 650; "alt =" "width =" 330 "height =" 518 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMLLWpnM2TA000Mi "src =" http://files.note.sdo.com/p-WLt ~ JMLLWpnM2TA000Mi "/>

Zoom in as follows: You can see the elements contained in the entire desktop. The top is the google search box, the bottom is a always plug-in, the icon, a separator, And the dock. Please note that the desktop program does not actually contain desktop wallpapers. In fact, desktop wallpapers are provided by WallpaperManagerService. The whole desktop is actually a layer that is superimposed on the entire desktop wallpaper.

650) this. width = 650; "alt =" "width =" 330 "height =" 441 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMLLfpnM2TA000LW "src =" http://files.note.sdo.com/p-WLt ~ JMLLfpnM2TA000LW "/>

The entire Launcher. xml layout file is as follows:

<com.android.launcher2.DragLayer    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:launcher="http://schemas.android.com/apk/res/com.android.launcher"    android:id="@+id/drag_layer"    android:layout_width="match_parent"    android:layout_height="match_parent">    <!-- Keep these behind the workspace so that they are not visible when         we go into AllApps -->    <include        android:id="@+id/dock_divider"        layout="@layout/workspace_divider"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_marginBottom="@dimen/button_bar_height"        android:layout_gravity="bottom" />    <include        android:id="@+id/paged_view_indicator"        layout="@layout/scroll_indicator"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="bottom"        android:layout_marginBottom="@dimen/button_bar_height" />    <!-- The workspace contains 5 screens of cells -->    <com.android.launcher2.Workspace        android:id="@+id/workspace"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:paddingTop="@dimen/qsb_bar_height_inset"        android:paddingBottom="@dimen/button_bar_height"        launcher:defaultScreen="2"        launcher:cellCountX="4"        launcher:cellCountY="4"        launcher:pageSpacing="@dimen/workspace_page_spacing"        launcher:scrollIndicatorPaddingLeft="@dimen/workspace_divider_padding_left"        launcher:scrollIndicatorPaddingRight="@dimen/workspace_divider_padding_right">        <include android:id="@+id/cell1" layout="@layout/workspace_screen" />        <include android:id="@+id/cell2" layout="@layout/workspace_screen" />        <include android:id="@+id/cell3" layout="@layout/workspace_screen" />        <include android:id="@+id/cell4" layout="@layout/workspace_screen" />        <include android:id="@+id/cell5" layout="@layout/workspace_screen" />    </com.android.launcher2.Workspace>    <include layout="@layout/hotseat"        android:id="@+id/hotseat"        android:layout_width="match_parent"        android:layout_height="@dimen/button_bar_height_plus_padding"        android:layout_gravity="bottom" />    <include        android:id="@+id/qsb_bar"        layout="@layout/qsb_bar" />    <include layout="@layout/apps_customize_pane"        android:id="@+id/apps_customize_pane"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:visibility="invisible" />    <include layout="@layout/workspace_cling"        android:id="@+id/workspace_cling"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:visibility="gone" />    <include layout="@layout/folder_cling"        android:id="@+id/folder_cling"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:visibility="gone" /></com.android.launcher2.DragLayer>


 

The root of the Launcher layout is DragLayer, which inherits FrameLayout. Therefore, DragLayer can be considered as a FrameLayout. The following is dock_divider. It uses the include keyword to include another layout file workspace_divider.xml, and this workspace_divider.xml contains an ImageView. In fact, dock_divider is the line above the dock area.

The following is paged_view_indicator, which also contains scroll_indicator.xml, which contains an ImageView and displays a. 9 png file. It is actually the blue page indicator when the Launcher rolls pages.

Then, the core container WorkSpace on the desktop, as shown in, of course, you only see a part of the Workspace, which is actually a workspace_screen, through Launcher. xml shows that the entire workspace is composed of five workspace_screens. Each workspace_screen is a page corresponding to the desktop. Each workspace_screen contains a CellLayout, which is a custom control inherited from the ViewGroup. Therefore, it is a layout control, it is mainly used to hold the desktop icons, widgets, and folders on each page.

650) this. width = 650; "alt =" "width =" 330 "height =" 470 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMQ00VnM2TA001W0 "src =" http://files.note.sdo.com/p-WLt ~ JMQ00VnM2TA001W0 "/>

View the following layout structure. Because the figure is too large, only part of the layout is truncated. The Workspace contains five CellLayout numbers ranging from 0 to 4.

650) this. width = 650; "alt =" "width =" 330 "height =" 399 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMLKxMLX018000JN "src =" http://files.note.sdo.com/p-WLt ~ JMLKxMLX018000JN "/>

Next is a Hotseat, which is actually the dock area. :

650) this. width = 650; "alt =" "width =" 330 "height =" 72 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMLXdFnM2TA000Re "src =" http://files.note.sdo.com/p-WLt ~ JMLXdFnM2TA000Re "/>

As shown in the following figure, this Hotseat actually contains a CellLayout, which is used to hold four icons and the buttons for starting all programs in the middle.

650) this. width = 650; "alt =" "width =" 330 "height =" 128 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMLXVpnM2TA000Rt "src =" http://files.note.sdo.com/p-WLt ~ JMLXVpnM2TA000Rt "/>

The qsb_bar is the top google search box on the screen. The search box is independent of the icon interface, so when we flip the desktop, the search box will remain unchanged at the top, as shown below:

650) this. width = 650; "alt =" "width =" 330 "height =" 43 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMQ2vwLX018001UH "src =" http://files.note.sdo.com/p-WLt ~ JMQ2vwLX018001UH "/>

Then there are three hidden interfaces during initialization.

Apps_customize_pane: Click the show all applications button in the dock to switch from the hidden state to the display state, as shown in. The interface for all applications and all plug-ins is displayed.

650) this. width = 650; "alt =" "width =" 330 "height =" 469 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMPM9VnM2TA001M _ "src =" http://files.note.sdo.com/p-WLt ~ JMPM9VnM2TA001M _ "/>

By viewing pai_customize_pane.xml, we can see that pai_customize_pane consists of two parts:

The tabs_container and tabs sections let us choose whether to add an application or a widget, as shown in:

650) this. width = 650; "alt =" "width =" 330 "height =" 54 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMQOa0LX0NU000tz "src =" http://files.note.sdo.com/p-WLt ~ JMQOa0LX0NU000tz "/>

Tabcontent. After the corresponding tab is selected, the following section displays the application or widget, as shown in:

650) this. width = 650; "alt =" "width =" 330 "height =" 415 "kesrc =" http://files.note.sdo.com/p-WLt ~ JMQRgVnM1bw000hJ "src =" http://files.note.sdo.com/p-WLt ~ JMQRgVnM1bw000hJ "/>

Workspace_cling and folder_cling are the wizard interface displayed when you enter the desktop after the machine is flushed. This shows how to use workspace and folder. They will not appear again after being skipped.


 

This article is from the "best silly blog" blog, please be sure to keep this http://zuiniuwang.blog.51cto.com/3709988/768020

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.