Android企业级实战-界面篇-1

前言

计蒙从上班再次回到学校生活后,认识的很多学校软件系朋友通过校招拿到了大厂Android开发岗位的offer,计蒙因为学习是专科起点,到本科后算法部分缺陷极大,仅拿到一家大厂offer,由于个人好不容易回到校园生活,不想太早再次回到上班的日子,于是继续准备升学,为了不将Android遗忘,还是偶尔写写代码,也就有了此文章。

1.实现效果

图片
图片
图片

2.而实现前准备

1.莫大厂规范(为例)

图片

2.dimens.xml文件内容(此案例可用)

<?xml version="1.0" encoding="utf-8"?><resources>    <dimen name="jimeng_dp_0">0.0dip</dimen>    <dimen name="jimeng_dp_05">0.5dip</dimen>    <dimen name="jimeng_dp_1">1.0dip</dimen>    <dimen name="jimeng_dp_10">10.0dip</dimen>    <dimen name="jimeng_dp_100">100.0dip</dimen>    <dimen name="jimeng_dp_11">11.0dip</dimen>    <dimen name="jimeng_dp_115">115.0dip</dimen>    <dimen name="jimeng_dp_12">12.0dip</dimen>    <dimen name="jimeng_dp_120">120.0dip</dimen>    <dimen name="jimeng_dp_123">123.0dip</dimen>    <dimen name="jimeng_dp_13">13.0dip</dimen>    <dimen name="jimeng_dp_135">135.0dip</dimen>    <dimen name="jimeng_dp_14">14.0dip</dimen>    <dimen name="jimeng_dp_140">140.0dip</dimen>    <dimen name="jimeng_dp_15">15.0dip</dimen>    <dimen name="jimeng_dp_16">16.0dip</dimen>    <dimen name="jimeng_dp_169">169.0dip</dimen>    <dimen name="jimeng_dp_17">17.0dip</dimen>    <dimen name="jimeng_dp_18">18.0dip</dimen>    <dimen name="jimeng_dp_183">183.0dip</dimen>    <dimen name="jimeng_dp_2">2.0dip</dimen>    <dimen name="jimeng_dp_20">20.0dip</dimen>    <dimen name="jimeng_dp_22">22.0dip</dimen>    <dimen name="jimeng_dp_225">225.0dip</dimen>    <dimen name="jimeng_dp_24">24.0dip</dimen>    <dimen name="jimeng_dp_246">246.0dip</dimen>    <dimen name="jimeng_dp_250">250.0dip</dimen>    <dimen name="jimeng_dp_28">28.0dip</dimen>    <dimen name="jimeng_dp_280">280.0dip</dimen>    <dimen name="jimeng_dp_30">30.0dip</dimen>    <dimen name="jimeng_dp_32">32.0dip</dimen>    <dimen name="jimeng_dp_34">34.0dip</dimen>    <dimen name="jimeng_dp_375">375.0dip</dimen>    <dimen name="jimeng_dp_38">38.0dip</dimen>    <dimen name="jimeng_dp_4">4.0dip</dimen>    <dimen name="jimeng_dp_40">40.0dip</dimen>    <dimen name="jimeng_dp_43">43.0dip</dimen>    <dimen name="jimeng_dp_44">44.0dip</dimen>    <dimen name="jimeng_dp_45">45.0dip</dimen>    <dimen name="jimeng_dp_46">46.0dip</dimen>    <dimen name="jimeng_dp_48">48.0dip</dimen>    <dimen name="jimeng_dp_49">49.0dip</dimen>    <dimen name="jimeng_dp_5">5.0dip</dimen>    <dimen name="jimeng_dp_50">50.0dip</dimen>    <dimen name="jimeng_dp_54">54.0dip</dimen>    <dimen name="jimeng_dp_55">55.0dip</dimen>    <dimen name="jimeng_dp_56">56.0dip</dimen>    <dimen name="jimeng_dp_58">58.0dip</dimen>    <dimen name="jimeng_dp_6">6.0dip</dimen>    <dimen name="jimeng_dp_60">60.0dip</dimen>    <dimen name="jimeng_dp_64">64.0dip</dimen>    <dimen name="jimeng_dp_65">65.0dip</dimen>    <dimen name="jimeng_dp_68">68.0dip</dimen>    <dimen name="jimeng_dp_7">7.0dip</dimen>    <dimen name="jimeng_dp_70">70.0dip</dimen>    <dimen name="jimeng_dp_75">75.0dip</dimen>    <dimen name="jimeng_dp_76">76.0dip</dimen>    <dimen name="jimeng_dp_8">8.0dip</dimen>    <dimen name="jimeng_dp_84">84.0dip</dimen>    <dimen name="jimeng_dp_86">86.0dip</dimen>    <dimen name="jimeng_dp_90">90.0dip</dimen>    <dimen name="jimeng_px_1">1.0px</dimen>    <dimen name="dp_10">10.0dip</dimen></resources>

3.ids.xml文件内容(此案例可用)

<resources><!--    第一个UI模块id-->    <item type="id" name="like_icon" />    <item type="id" name="user_profile_all_msg_layout" />    <item type="id" name="ll_msg_layout1" />    <item type="id" name="my_msg_like" />    <item type="id" name="like_txt" />    <item type="id" name="like_num" />    <item type="id" name="my_msg_comment" />    <item type="id" name="comment_txt" />    <item type="id" name="comment_icon" />    <item type="id" name="comment_num" />    <item type="id" name="my_msg_chat" />    <item type="id" name="chat_icon" />    <item type="id" name="chat_txt" />    <item type="id" name="chat_num" />    <item type="id" name="my_msg_notification" />    <item type="id" name="notification_icon" />    <item type="id" name="notification_num" />    <item type="id" name="notification_txt" />    <item type="id" name="ll_msg_layout" />    <item type="id" name="ll_my_history" />    <item type="id" name="iv_foot_print_txt" />    <item type="id" name="foot_print_txt" />    <item type="id" name="ll_draft_box" />    <item type="id" name="iv_draft_icon" />    <item type="id" name="tv_draft_" />    <item type="id" name="ll_question_box" />    <item type="id" name="question_icon" />    <item type="id" name="tv_question_box_count" />    <item type="id" name="question_txt" />    <item type="id" name="user_customer_layout" />    <item type="id" name="feedback_icon" />    <item type="id" name="qiyu_tip" />    <item type="id" name="user_customer_title" />    <item type="id" name="rl_view_stub" />    <item type="id" name="rl_view_stub1" />
</resources>

4.colors.xml文件内容(此案例可用)

    <color name="jimeng_background_primary_light">#ffffffff</color>    <color name="jimeng_white">@color/jimeng_background_primary_light</color>    <color name="jimeng_text_primary_light">#ff2e2e2e</color>    <color name="jimeng_black">@color/jimeng_text_primary_light</color>    <color name="jimeng_red_light">#ffff6c93</color>

5.strings.xml文件内容(此案例可用)

    <string name="str_they_like_me">收到的喜欢</string>    <string name="str_comment">评论</string>    <string name="str_chat">聊天</string>    <string name="str_notification">通知</string>    <string name="str_help_and_feedback">帮助与反馈</string>    <string name="str_question_box">提问箱</string>    <string name="str_drafts">草稿箱</string>    <string name="str_footprint">足迹</string>

3.实现

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:id="@id/user_profile_all_msg_layout"    android:layout_width="fill_parent"    android:layout_height="wrap_content"    android:layout_marginTop="@dimen/jimeng_dp_16"    android:orientation="vertical">
<LinearLayout android:id="@id/ll_msg_layout1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="@dimen/jimeng_dp_16" android:layout_marginRight="@dimen/jimeng_dp_16" android:background="@color/jimeng_white" android:orientation="horizontal">
<RelativeLayout android:id="@id/my_msg_like" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical">
<TextView android:id="@id/like_txt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/like_icon" android:layout_centerHorizontal="true" android:text="@string/str_they_like_me" android:textColor="@color/jimeng_black" android:textSize="12.0dip" />
<ImageView android:id="@id/like_icon" android:layout_width="44.0dip" android:layout_height="44.0dip" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:scaleType="centerCrop" android:src="@drawable/account_icon_messages_liked_light" />
<TextView android:id="@id/like_num" android:layout_width="wrap_content" android:layout_height="18.0dip" android:layout_alignLeft="@id/like_icon" android:layout_marginLeft="26.0dip" android:background="@drawable/profile_notification_count_bg" android:gravity="center" android:paddingLeft="6.0dip" android:paddingRight="6.0dip" android:text="11" android:textColor="@color/white" android:textSize="10.0dip" android:visibility="gone" /> </RelativeLayout>
<RelativeLayout android:id="@id/my_msg_comment" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical">
<TextView android:id="@id/comment_txt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/comment_icon" android:layout_centerHorizontal="true" android:text="@string/str_comment" android:textColor="@color/jimeng_black" android:textSize="12.0dip" />
<ImageView android:id="@id/comment_icon" android:layout_width="44.0dip" android:layout_height="44.0dip" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:scaleType="centerCrop" android:src="@drawable/account_icon_messages_commend_light" />
<TextView android:id="@id/comment_num" android:layout_width="wrap_content" android:layout_height="18.0dip" android:layout_alignLeft="@id/comment_icon" android:layout_marginLeft="26.0dip" android:background="@drawable/profile_notification_count_bg" android:gravity="center" android:paddingLeft="6.0dip" android:paddingRight="6.0dip" android:text="999+" android:textColor="@color/white" android:textSize="10.0dip" android:visibility="gone" /> </RelativeLayout>
<RelativeLayout android:id="@id/my_msg_chat" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical">
<TextView android:id="@id/chat_txt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/chat_icon" android:layout_centerHorizontal="true" android:text="@string/str_chat" android:textColor="@color/jimeng_black" android:textSize="12.0dip" />
<ImageView android:id="@id/chat_icon" android:layout_width="44.0dip" android:layout_height="44.0dip" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:src="@drawable/account_icon_messages_chat_light" />
<TextView android:id="@id/chat_num" android:layout_width="wrap_content" android:layout_height="18.0dip" android:layout_alignLeft="@id/chat_icon" android:layout_marginLeft="26.0dip" android:background="@drawable/profile_notification_count_bg" android:gravity="center" android:paddingLeft="6.0dip" android:paddingRight="6.0dip" android:text="999+" android:textColor="@color/white" android:textSize="10.0dip" android:visibility="gone" /> </RelativeLayout>
<RelativeLayout android:id="@id/my_msg_notification" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical">
<TextView android:id="@id/notification_txt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/notification_icon" android:layout_centerHorizontal="true" android:text="@string/str_notification" android:textColor="@color/jimeng_black" android:textSize="12.0dip" />
<ImageView android:id="@id/notification_icon" android:layout_width="44.0dip" android:layout_height="44.0dip" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:scaleType="centerCrop" android:src="@drawable/account_icon_messages_notification_light" />
<TextView android:id="@id/notification_num" android:layout_width="wrap_content" android:layout_height="18.0dip" android:layout_alignLeft="@id/notification_icon" android:layout_marginLeft="26.0dip" android:background="@drawable/profile_notification_count_bg" android:gravity="center" android:paddingLeft="6.0dip" android:paddingRight="6.0dip" android:text="999+" android:textColor="@color/white" android:textSize="10.0dip" android:visibility="gone" /> </RelativeLayout> </LinearLayout>
<LinearLayout android:id="@id/ll_msg_layout" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="@dimen/jimeng_dp_16" android:layout_marginTop="@dimen/jimeng_dp_10" android:layout_marginRight="@dimen/jimeng_dp_16" android:background="@color/jimeng_white" android:orientation="horizontal">
<RelativeLayout android:id="@id/ll_my_history" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical">
<TextView android:id="@id/foot_print_txt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/iv_foot_print_txt" android:layout_centerHorizontal="true" android:text="@string/str_footprint" android:textColor="@color/jimeng_black" android:textSize="12.0dip" />
<ImageView android:id="@id/iv_foot_print_txt" android:layout_width="44.0dip" android:layout_height="44.0dip" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:scaleType="centerCrop" android:src="@drawable/account_icon_messages_footprint_light" /> </RelativeLayout>
<RelativeLayout android:id="@id/ll_draft_box" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical">
<TextView android:id="@id/tv_draft_" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/iv_draft_icon" android:layout_centerHorizontal="true" android:text="@string/str_drafts" android:textColor="@color/jimeng_black" android:textSize="12.0dip" />
<ImageView android:id="@id/iv_draft_icon" android:layout_width="44.0dip" android:layout_height="44.0dip" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:scaleType="centerCrop" android:src="@drawable/account_icon_messages_drafts_light" /> </RelativeLayout>
<RelativeLayout android:id="@id/ll_question_box" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical">
<TextView android:id="@id/question_txt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/question_icon" android:layout_centerHorizontal="true" android:text="@string/str_question_box" android:textColor="@color/jimeng_black" android:textSize="12.0dip" />
<ImageView android:id="@id/question_icon" android:layout_width="44.0dip" android:layout_height="44.0dip" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:src="@drawable/account_icon_messages_question_light" />
<ImageView android:id="@id/tv_question_box_count" android:layout_width="8.0dip" android:layout_height="8.0dip" android:layout_alignLeft="@id/question_icon" android:layout_marginLeft="33.0dip" android:layout_marginTop="@dimen/jimeng_dp_4" android:background="@drawable/common_icon_notification_small" android:gravity="center" android:paddingLeft="6.0dip" android:paddingRight="6.0dip" android:textSize="10.0dip" android:visibility="gone" /> </RelativeLayout>
<RelativeLayout android:id="@id/user_customer_layout" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical">
<TextView android:id="@id/user_customer_title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/feedback_icon" android:layout_centerHorizontal="true" android:ellipsize="middle" android:singleLine="true" android:text="@string/str_help_and_feedback" android:textColor="@color/jimeng_black" android:textSize="12.0dip" />
<ImageView android:id="@id/feedback_icon" android:layout_width="44.0dip" android:layout_height="44.0dip" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:scaleType="centerCrop" android:src="@drawable/account_icon_messages_help_light" />
<ImageView android:id="@id/qiyu_tip" android:layout_width="8.0dip" android:layout_height="8.0dip" android:layout_alignLeft="@id/feedback_icon" android:layout_marginLeft="33.0dip" android:layout_marginTop="@dimen/jimeng_dp_4" android:background="@drawable/common_icon_notification_small" android:gravity="center" android:paddingLeft="6.0dip" android:paddingRight="6.0dip" android:visibility="gone" /> </RelativeLayout>
<RelativeLayout android:id="@id/rl_view_stub" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical" android:visibility="gone" />
<RelativeLayout android:id="@id/rl_view_stub1" android:layout_width="0.0dip" android:layout_height="wrap_content" android:layout_weight="1.0" android:orientation="vertical" android:visibility="gone" /> </LinearLayout></LinearLayout>

4.注意

图片

第三步代码中,有8张UI图,一张小红点图,以及一个红框样式文件(用来在java代码实现提示效果,如不需要可删除)。

5.使用

<include layout="@layout/user_profile_all_msg_layout" />

声明:文中观点不代表本站立场。本文传送门:https://eyangzhen.com/221935.html

联系我们
联系我们
分享本页
返回顶部