5.UI设置

<br/><p> * 在项目中,对UI的控件大小、颜色、背景样式做了一些定义,在app/src/main/res目录下。以下是一些常用的UI设置值。 1. 大小(../values/dimens.xml) ~~~ <!--距离 new standard--> <dimen name="resp_stroke_width">2dp</dimen> <dimen name="mini_margin">4dp</dimen> <dimen name="smaller_margin">6dp</dimen> <dimen name="base_margin_padding">8dp</dimen> <dimen name="dialog_margin">10dp</dimen> <dimen name="small_margin">12dp</dimen> <dimen name="normal_margin">16dp</dimen> <dimen name="large_margin">24dp</dimen> <dimen name="bigger_margin">32dp</dimen> <dimen name="dialog_left_right_margin">36dp</dimen> <dimen name="call_item_height">40dp</dimen> <dimen name="biggest_margin">48dp</dimen> <dimen name="item_height">56dp</dimen> <dimen name="item_chatlist_margin">80dp</dimen> <dimen name="dialog_normal_width">280dp</dimen> <!--侧边导航栏icon大小--> <dimen name="design_navigation_icon_size">20dp</dimen> <!-- 字体大小 --> <dimen name="mini">10sp</dimen> <dimen name="smaller">12sp</dimen> <dimen name="md_small">13sp</dimen> <dimen name="small">14sp</dimen> <dimen name="regular">15sp</dimen> <dimen name="medium">16sp</dimen> <dimen name="md_big">17sp</dimen> <dimen name="big">18sp</dimen> <dimen name="bigger">22sp</dimen> <dimen name="large">24sp</dimen> <dimen name="biggest">32sp</dimen> <dimen name="small_title_size">21sp</dimen> ~~~ 2. 颜色(../values/color.xml) ~~~ //主色 <color name="base_blue">#33A868</color> <color name="bar_color">#FF128446</color> <color name="base_blue_translucent">#a033A868</color> <color name="base_blue_qtr_transparent">#4033A868</color> //辅主色 <color name="second_base_color">#FFA300</color> //字体颜色 <color name="new_text_color_first">#DD000000</color> //字体辅色 <color name="new_text_color_second">#8A000000</color> //黑色下划线 <color name="new_line_black_border">#1f000000</color> <color name="new_line_white_border">#1fFFFFFF</color> <color name="status_bar_bg">#33000000</color> <color name="forbid_click_color">#61000000</color> <color name="input_bg">#3AC077</color> <color name="progressbar_bg">#E2F5EA</color> <color name="progressbar_progress">#8ADBAE</color> <color name="progressbar_thumb_first">@color/progressbar_progress</color> <color name="progressbar_thumb_second">#808ADBAE</color> <color name="sliding_menu_bg">#373E39</color> ~~~ 3. 背景样式(../drawable、../drawable-v21) ① drawable | 引用文件 | 释义 | | --- | --- | | account_btn.xml | 主色弧角背景 | | circle_translucent_bg.xml | 圆形主色半透明背景 | | white_oval_bg.xml.xml | 圆形白色背景 | | green_et_border.xml | 白黄下划线selector | | seekbar_music_style.xml | 歌曲进度条样式 | | seekbar_style.xml | 其他SeekBar进度条样式 | | seekbar_thumb.xml | SeekBar拖动点样式 | | c_back_down.xml | 回退键样式 | ②drawable-v21,该目录下是针对Android 5.0+做的设配 | 引用文件 | 释义 | | --- | --- | | selector_view_bg.xml | 半透明主色矩形波纹效果 | | selector_view_bg_white.xml | 白色矩形波纹效果 | | selector_circle_view_bg.xml | 半透明主色圆形波纹效果 | | selector_white_circle_view_bg.xml | 白色圆形波纹效果 | * 另外,还有一些常用的自定义View放在`com.lingju.assistant.view`包下。 | 名称 | 释义 | | --- | --- | | VoiceWaveComponent | 主界面话筒 | | VoiceInputComponent | 备忘、提醒功能页话筒 | | VoiceComponent | 导航页面话筒 | | CommonDialog | 通用对话框 | | CommonEditDialog | 编辑对话框 | | LingjuSwipeRefreshLayout | 上、下拉刷新控件 | | com.lsjwzh.widget.materialloadingprogressbar.CircleProgressBar | 环形进度条 | | com.wdullaer.materialdatetimepicker.date.DatePickerDialog | 日期选择器 | | com.wdullaer.materialdatetimepicker.time.TimePickerDialog | 时间选择器 | * * * * * * **关于手机头部状态栏** 由于在values-v21/styles.xml设置了`<item name="android:windowTranslucentStatus">true</item>`, 会使页面内容延伸到状态栏。所以当开发者新建一个Activity页面时,若页面浸入了状态栏,需要在Activity的布局文件中,在最顶部设置一个View。 ~~~ <View android:id="@+id/status_bar" android:layout_width="match_parent" android:layout_height="25dp" android:background="@color/bar_color"/> ~~~ 然后在Activity的onCreate( )中,setContentView( )之后,动态设置该View的高度模拟状态栏。 ~~~ //设置模拟状态栏的高度 ViewGroup.LayoutParams layoutParams = mStatusBar.getLayoutParams(); layoutParams.height = ScreenUtil.getStatusBarHeight(this); mStatusBar.setLayoutParams(layoutParams); ~~~