android 字体显示框架,资源样式 - 主题 - 《XUI - Android 原生 UI 框架》 - 书栈网 · BookStack...

为了解决UI组件在不同尺寸设备上的渲染问题，我特别定制了3种不同设备尺寸的主题：“手机”(4.5英寸)，“小平板”(7英寸及以上，10英寸以下)和“大平板”(10英寸及以上)三种。

Theme框架中UI主题由顶至低，目前可分为4层：XUIRootTheme、XUIBaseTheme、XUITheme和XUITheme.xxx。XUIRootThemeTheme的最顶层，由各个 API Level 自行决定继承自系统的哪个Theme。目前框架中选择继承的是Android5.0以上最常用的主题：“Theme.AppCompat.Light.NoActionBar”。XUIBaseTheme基础 Theme，继承XUIRootTheme，定义所有公用的 style。这里主要设置的是应用全局性的样式，包括：colorAccent、colorPrimary、colorPrimaryDark、android:textColorPrimary、windowNoTitle、selectableItemBackground、android:textViewStyle、android:listSelector、android:listDivider、android:gridViewStyle等XUIThemeXUI框架的基础 Theme，继承XUIBaseTheme，可根据应用自身的特点自定义自己独特性全局性的Style。XUITheme.xxx框架默认提供的UI主题，继承XUITheme。可根据实际需求修改特定组件的主题样式。具体可分为大平板(XUITheme.Tablet.Big)、小平板(XUITheme.Tablet.Small)和手机(XUITheme.Phone)三种样式，其中大平板和小平板又共同继承了平板主题(XUITheme.Tablet)。

Theme表框架默认提供了多种UI主题XUITheme.Launch：启动页面的主题

XUITheme.Tablet：平板的主题

XUITheme.Tablet.Big：大平板的主题

XUITheme.Tablet.Small：小平板的主题

XUITheme.Phone：手机的主题

XUIDialog：基础对话框的主题

XUIDialog.Custom：自定义对话框的主题

Theme属性表主题属性使用?attr/的方式进行引用。

全局属性属性名类型默认值(手机/小平板/大平板)备注xui_config_content_spacing_horizontaldimension12dp/16dp/20dp水平间距

xui_config_content_spacing_verticaldimension7.5dp/10dp/12dp垂直间距

xui_config_color_backgroundcolor#EEF3F7/#EAEDEF窗体的背景颜色

xui_config_color_separator_lightcolor#F0F2F4/#F0F2F4小的分割块使用浅色的分割线

xui_config_color_separator_darkcolor#E3E6EA/#D9DDE1大的分割块使用深色的分割线[像ListView、GridView之类]

xui_config_divider_heightdimension0.5dp/1dp条目的分割线高度

xui_config_separator_heightdimension1dp/2dp/3dp分割块分割线的高度

标题栏属性属性名类型默认值(手机/小平板/大平板)备注xui_actionbar_colorcolor#299EE3标题栏的背景颜色

xui_actionbar_heightdimension52dp/60dp/70dp标题栏的高度

xui_actionbar_title_text_sizedimension18sp/21sp/24sp标题文字的大小

xui_actionbar_action_text_sizedimension15sp/18sp/22sp标题栏两边Action文字的大小

xui_actionbar_sub_text_sizedimension12sp/14sp/16sp副标题文字的大小

xui_actionbar_action_paddingdimension5dp/6dp/7dp标题栏两边Action图片的内间距

xui_actionbar_side_text_paddingdimension14dp/16dp/18dp标题栏两边Action文字的内间距

按钮属性属性名类型默认值(手机/小平板/大平板)备注xui_round_btn_bg_colorcolor@color/xui_transparent圆角按钮的背景颜色

xui_round_btn_border_colorcolor@color/xui_default_round_btn_blue_border圆角按钮的边框颜色

xui_round_btn_text_colorcolor@color/xui_default_round_btn_blue_text圆角按钮的文字颜色

xui_btn_view_radiusdimension5dp/5dp/7dp按钮的圆角度数

xui_btn_view_widthdimension104dp/112dp/148dp按钮的宽度

xui_btn_view_heightdimension32dp/38dp/52dp按钮的高度

xui_btn_view_text_sizedimension13sp/16sp/21sp按钮的文字大小

xui_btn_view_border_widthdimension0.5dp/1dp/1dp按钮的边框宽度

xui_config_icon_drawable_paddingdimension7dp/9dp/12dp按钮图标的内间距

文字属性属性名类型默认值(手机/小平板/大平板)备注xui_config_size_title_textdimension18sp/21sp/24sp标题文字的大小

xui_config_size_content_textdimension15sp/18sp/22sp正文文字的大小

xui_config_size_explain_textdimension12sp/14sp/16sp辅助说明文字的大小

xui_config_color_title_textcolor#223B53标题文字的颜色

xui_config_color_content_textcolor#6A798E正文文字的颜色

xui_config_color_explain_textcolor#9FABBC辅助说明文字的颜色

输入框属性属性名类型默认值(手机/小平板/大平板)备注xui_config_size_edittext_input_textdimension13sp/15sp/20sp输入框文字的大小

xui_config_size_edittext_helper_textdimension8sp/9sp/12sp输入提示信息文字的大小

xui_config_size_edittext_components_spacingdimension7sp/8sp/10sp输入框上下直接的间距

xui_config_size_edittext_left_paddingdimension10dp/13dp/17dp输入框的左间距

xui_config_size_edittext_radiusdimension4dp/4dp/5dp输入框的圆角大小

xui_config_size_edittext_heightdimension30dp/30dp/40dp输入框的高度

pop弹出框属性属性名类型默认值(手机/小平板/大平板)备注xui_popup_bgreference@drawable/xui_popup_bg弹出窗的背景

xui_popup_arrow_downreference@drawable/xui_popup_arrow_down弹出窗向下的箭头

xui_popup_arrow_upreference@drawable/xui_popup_arrow_up弹出窗向上的箭头

xui_popup_arrow_up_margin_topdimension17dp弹出窗向上箭头距离顶部的高度

xui_popup_arrow_down_margin_bottomdimension17dp弹出窗向下箭头距离底部的高度

xui_popup_widthdimension133dp/174dp/232dp弹出窗的最大宽度

dialog属性属性名类型默认值(手机/小平板/大平板)备注xui_dialog_radius_sizedimension7dp/8dp/10dp对话框的圆角大小

xui_dialog_background_dim_amountfloat0.6对话框透明背景的灰度

xui_dialog_loading_padding_sizedimension26dp/30dp/40dploading对话框的内间距

xui_dialog_loading_min_sizedimension100dp/150dp/200dploading对话框的最小尺寸

loading加载属性属性名类型默认值(手机/小平板/大平板)备注xui_loading_view_sizedimension78dp/100dp/135dploading控件的尺寸

xui_loading_view_widthdimension4dp/5dp/6dploading环的宽度

xui_loading_margin_sizedimension6dp/10dp/14dploading控件的外间距

mini_loading_view_sizedimension20dp/30dp/40dp迷你loading控件的尺寸

如何自定义自己的主题

如何自定义

前面说过了XUI默认提供了四层主题，这里我们定义自己的主题主要是覆盖XUITheme主题。

@style/WindowAnimStyle

@color/app_color_theme_1

@color/xui_config_color_primary_text

true

@style/TitleBar.Custom

@color/xui_config_color_primary_text

true

@anim/xpage_slide_in_right

@anim/xpage_slide_out_left

@anim/xpage_slide_in_left

@anim/xpage_slide_out_right

自定义基础主题属性通用颜色属性属性名类型备注colorAccentcolor应用控件默认和选中的主要色调

colorPrimarycolor应用的主要色调，actionBar默认使用该颜色，Toolbar导航栏的底色

colorPrimaryDarkcolor应用的主要暗色调，statusBarColor默认使用该颜色

colorControlNormalcolor应用控件未选中的色调

android:textColorPrimarycolor应用的主要文字颜色

xui_config_color_title_textcolor标题文字的颜色

xui_config_color_content_textcolor正文文字的颜色

xui_config_color_explain_textcolor辅助说明文字的颜色

xui_config_color_error_textcolor出错文字的颜色

xui_config_color_input_textcolor输入文字的颜色

xui_config_color_hint_textcolor提示文字的颜色

xui_config_color_strokecolor应用边框的颜色

xui_config_color_disablecolor应用不可点击的颜色

xui_config_color_pressedcolor应用点击后的颜色

xui_config_color_backgroundcolor应用默认的背景颜色

xui_config_color_separator_lightcolor小的分割块使用浅色的分割线

xui_config_color_separator_darkcolor大的分割块使用深色的分割线[像ListView、GridView之类]通用尺寸属性属性名类型备注xui_config_content_spacing_horizontaldimensionmargin 和 padding 等使用的内容通用水平间距

xui_config_content_spacing_verticaldimensionmargin 和 padding 等使用的内容通用垂直间距

xui_alpha_presseddimension控件点击时的透明度

xui_alpha_disableddimension控件不可点击时的透明度

xui_config_divider_heightdimension分隔线的高度

xui_config_separator_heightdimension分割线的高度

xui_config_size_title_textdimension标题文字的颜色

xui_config_size_content_textdimension正文文字的颜色

xui_config_size_explain_textdimension解释说明文字的颜色

xui_btn_view_radiusdimension按钮通用的圆角大小

xui_btn_view_widthdimension按钮通用的宽度

xui_btn_view_heightdimension按钮通用的高度

xui_btn_view_text_sizedimension按钮通用的文字大小

xui_btn_view_border_widthdimension按钮边框通用的宽度

xui_config_size_spinner_textdimension下拉框文字的大小

xui_dialog_radius_sizedimension通用弹窗的圆角大小

xui_dialog_background_dim_amountdimension通用弹窗背景阴影的透明度

自定义通用组件的默认主题样式标题栏属性属性名类型备注xui_actionbar_colorcolor标题栏的背景颜色

xui_actionbar_text_colorcolor标题栏文字的颜色

xui_actionbar_immersiveboolean是否支持沉浸式标题栏

xui_actionbar_ic_navigation_backreference标题栏返回箭头图标

xui_actionbar_heightdimension标题栏的高度

xui_actionbar_title_text_sizedimension标题栏标题文字的大小

xui_actionbar_sub_text_sizedimension标题栏副标题文字的大小

xui_actionbar_action_text_sizedimension标题栏动作文字的大小

xui_actionbar_action_paddingdimension标题栏动作图片的padding

xui_actionbar_side_text_paddingdimension标题栏两侧文字的padding通用组件样式属性属性名类型备注TitleBarStylereference标题栏组件TitleBar

XUIGroupListViewStylereference通用列表组控件XUIGroupListView

XUICommonListItemViewStylereference通用列表项控件XUICommonListItemView

XUIGroupListSectionViewStylereference通用列表头尾控件XUIGroupListSectionHeaderFooterView

MiniLoadingStylereference迷你加载控件MiniLoadingView

RulerViewStylereference刻度尺控件RulerView

RadiusImageViewStylereference提供图片添加圆角、边框、剪裁到圆形或其他形状等功能的RadiusImageView

TabSegmentStylereference选项卡组件TabSegment

VerifyCodeEditTextStylereference验证码输入框VerifyCodeEditText

HorizontalProgressViewStylereference水平进度条HorizontalProgressView

CircleProgressViewStylereference环形进度条CircleProgressView

ClearEditTextStylereference可清空输入的输入框ClearEditText

PasswordEditTextStylereference可显示隐藏密码的输入框PasswordEditText

MaterialEditTextStylereferenceMaterial Design风格的输入框MaterialEditText

ValidatorEditTextStylereference可以自动校验的输入框ValidatorEditText

MultiLineEditTextStylereference多行计数输入框MultiLineEditText

EasyIndicatorStylereference简单索引控件EasyIndicator

MultipleStatusViewStylereference多状态布局控件MultipleStatusView

StatusViewStylereference状态控件StatusView

CountDownButtonStylereference倒计时按钮CountDownButton

AutoFitTextViewStylereference自适应文字大小的组件AutoFitTextView

RippleViewStylereference点击水波效果

的组件RippleView

BannerLayoutStylereference使用RecyclerView实现Banner的BannerLayout