1. 程式人生 > >Android 主題及自定義視窗

Android 主題及自定義視窗

用主題自定義視窗屬性

使用Android系統主題:

R.styles.xml中包含了系統的一些主題;

我們常見的系統主題有:

Theme.Light : 該主題的背景和使用者元素使用一個相反的顏色主題. 為Android3.0以前的預設推薦基礎主題;

  <style name="Theme.Light">
        <item name="isLightTheme">true</item>
        <item name="windowBackground">@drawable/screen_background_selector_light</item>
        <item name="windowClipToOutline">false</item>

        <item name="colorBackground">@color/background_light</item>
        <item name="colorForeground">@color/bright_foreground_light</item>
        <item name="colorForegroundInverse">@color/bright_foreground_light_inverse</item>

        <item name="colorPrimaryDark">@color/legacy_light_primary_dark</item>
        <item name="colorPrimary">@color/legacy_light_primary</item>
        <item name="colorControlActivated">@color/legacy_light_control_activated</item>
        <item name="colorControlNormal">@color/legacy_light_control_normal</item>
        <item name="colorControlHighlight">@color/legacy_light_button_pressed</item>
        <item name="colorButtonNormal">@color/legacy_light_button_normal</item>

        <item name="textColorPrimary">@color/primary_text_light</item>
        <item name="textColorSecondary">@color/secondary_text_light</item>
        <item name="textColorTertiary">@color/tertiary_text_light</item>
        <item name="textColorPrimaryInverse">@color/primary_text_dark</item>
        <item name="textColorSecondaryInverse">@color/secondary_text_dark</item>
        <item name="textColorTertiaryInverse">@color/tertiary_text_dark</item>
        <item name="textColorPrimaryActivated">@color/primary_text_light</item>
        <item name="textColorSecondaryActivated">@color/secondary_text_light</item>
        <item name="textColorPrimaryDisableOnly">@color/primary_text_light_disable_only</item>
        <item name="textColorPrimaryInverseDisableOnly">@color/primary_text_dark_disable_only</item>
        <item name="textColorPrimaryNoDisable">@color/primary_text_light_nodisable</item>
        <item name="textColorSecondaryNoDisable">@color/secondary_text_light_nodisable</item>
        <item name="textColorPrimaryInverseNoDisable">@color/primary_text_dark_nodisable</item>
        <item name="textColorSecondaryInverseNoDisable">@color/secondary_text_dark_nodisable</item>
        <item name="textColorHint">@color/hint_foreground_light</item>
        <item name="textColorHintInverse">@color/hint_foreground_dark</item>
        <item name="textColorHighlight">@color/highlighted_text_light</item>
        <item name="textColorHighlightInverse">@color/highlighted_text_dark</item>
        <item name="textColorLink">@color/link_text_light</item>
        <item name="textColorLinkInverse">@color/link_text_dark</item>

        <item name="editTextColor">@color/primary_text_light</item>
        <item name="listChoiceBackgroundIndicator">@drawable/list_selector_background</item>

        <item name="activatedBackgroundIndicator">@drawable/activated_background_light</item>
        <item name="quickContactBadgeOverlay">@drawable/quickcontact_badge_overlay_light</item>

        <item name="popupWindowStyle">@style/Widget.PopupWindow</item>

        <item name="textCheckMark">@drawable/indicator_check_mark_light</item>
        <item name="textCheckMarkInverse">@drawable/indicator_check_mark_dark</item>

        <item name="gestureOverlayViewStyle">@style/Widget.GestureOverlayView.White</item>
        <item name="expandableListViewStyle">@style/Widget.ExpandableListView.White</item>
        <item name="listViewStyle">@style/Widget.ListView.White</item>
        <item name="listDivider">@drawable/divider_horizontal_bright</item>
        <item name="listSeparatorTextViewStyle">@style/Widget.TextView.ListSeparator.White</item>

        <item name="progressBarStyle">@style/Widget.ProgressBar.Inverse</item>
        <item name="progressBarStyleSmall">@style/Widget.ProgressBar.Small.Inverse</item>
        <item name="progressBarStyleLarge">@style/Widget.ProgressBar.Large.Inverse</item>
        <item name="progressBarStyleInverse">@style/Widget.ProgressBar</item>
        <item name="progressBarStyleSmallInverse">@style/Widget.ProgressBar.Small</item>
        <item name="progressBarStyleLargeInverse">@style/Widget.ProgressBar.Large</item>
        <item name="actionModeCutDrawable">@drawable/ic_menu_cut_holo_light</item>
        <item name="actionModeCopyDrawable">@drawable/ic_menu_copy_holo_light</item>
        <item name="actionModePasteDrawable">@drawable/ic_menu_paste_holo_light</item>
        <item name="actionModeSelectAllDrawable">@drawable/ic_menu_selectall_holo_light</item>
        <item name="actionModeShareDrawable">@drawable/ic_menu_share_holo_light</item>
        <item name="actionModeFindDrawable">@drawable/ic_menu_find_holo_light</item>
        <item name="actionModeWebSearchDrawable">@drawable/ic_menu_search_holo_light</item>
        <item name="actionModeBackground">@drawable/cab_background_top_holo_light</item>
        <item name="actionModeSplitBackground">@drawable/cab_background_bottom_holo_light</item>

        <item name="searchViewStyle">@style/Widget.Holo.Light.SearchView</item>
        <item name="detailsElementBackground">@drawable/panel_bg_holo_light</item>

        <item name="mediaRouteButtonStyle">@style/Widget.DeviceDefault.Light.MediaRouteButton</item>
        <item name="findOnPageNextDrawable">@drawable/ic_find_next_holo_light</item>
        <item name="findOnPagePreviousDrawable">@drawable/ic_find_previous_holo_light</item>

        <!-- Floating toolbar styles -->
        <item name="floatingToolbarCloseDrawable">@drawable/ic_ab_back_material_light</item>
        <item name="floatingToolbarForegroundColor">@color/foreground_material_light</item>
        <item name="floatingToolbarItemBackgroundBorderlessDrawable">@drawable/item_background_borderless_material_light</item>
        <item name="floatingToolbarItemBackgroundDrawable">@drawable/item_background_material_light</item>
        <item name="floatingToolbarOpenDrawable">@drawable/ic_menu_moreoverflow_material_light</item>
        <item name="floatingToolbarPopupBackgroundDrawable">@drawable/floating_popup_background_light</item>
    </style>

Theme.AppCompat.NoActionBar: 移除導航條標題欄

<style name="Theme.AppCompat.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>

...

在manifest使用系統主題:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.akm.akmviewpager" >

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@android:style/Theme.NoTitleBar" >
        <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>
    </application>

</manifest>

自定義主題:

系統的主題畢竟不能滿足各種奇葩的需求,需求我們自定義主題來解決這個問題;

1.建立主題

其實主題就是多種風格的樣式,所以建立主題放在res/values/styles.xml; 有關主題的元素可以看SDK的R.attr中檢視,上面系統主題中我們已經可以看到比較多的屬性元素;

<style name="Akm" parent="android:Theme">
        <!--action bar-->
        <item name="android:windowActionBar">false</item>
        <!-- title -->
        <item name="android:windowNoTitle">false</item>
        <!-- 視窗背景-->
        <item name="android:windowBackground">#ff00ff</item>
        <!-- true 全屏顯示-->
        <item name="android:windowFullscreen">true</item>
    </style>
主題類似Java類的關係, 是可以繼承的.

程式碼設定:

Activity.requestWindowFeature()方法修改視窗特性,該方法接收 int型別的 featureId

值得注意是該方法需要在setContentView()之前設定,在此後的設定不起效;

我們可以看看系統的window.java來簡單瞭解下可以設定的元素

/** Flag for the "options panel" feature.  This is enabled by default. */
    public static final int FEATURE_OPTIONS_PANEL = 0;
    /** Flag for the "no title" feature, turning off the title at the top
     *  of the screen. */
    public static final int FEATURE_NO_TITLE = 1;//無標題
    /** Flag for the progress indicator feature */
    public static final int FEATURE_PROGRESS = 2;//進度條
    /** Flag for having an icon on the left side of the title bar */
    public static final int FEATURE_LEFT_ICON = 3;//左圖示
    /** Flag for having an icon on the right side of the title bar */
    public static final int FEATURE_RIGHT_ICON = 4;//右圖示
    /** Flag for indeterminate progress */
    public static final int FEATURE_INDETERMINATE_PROGRESS = 5;
    /** Flag for the context menu.  This is enabled by default. */
    public static final int FEATURE_CONTEXT_MENU = 6;//選單
    /** Flag for custom title. You cannot combine this feature with other title features. */
    public static final int FEATURE_CUSTOM_TITLE = 7;//自定義標頭
    /**
     * Flag for enabling the Action Bar.
     * This is enabled by default for some devices. The Action Bar
     * replaces the title bar and provides an alternate location
     * for an on-screen menu button on some devices.
     */
    public static final int FEATURE_ACTION_BAR = 8;//導航欄
......

很多應用的夜間模式,就是設定主題樣式來實現的.只不過需要程式碼控制切換
<pre style="font-family: Menlo; font-size: 12pt; background-color: rgb(255, 255, 255);">