标签:android style blog http ar io color 使用 sp
最终实现的效果:
先看上面的怎么实现:
分为三个部分,一是返回的按钮,二是中间聊天的用户名或者聊天的群名,三是删除按钮或者群详情的按钮。
整体使用相对布局。
<RelativeLayout android:id="@+id/top_bar" android:layout_width="match_parent" android:layout_height="@dimen/height_top_bar" android:background="@color/common_top_bar_blue" android:gravity="center_vertical" > <LinearLayout android:layout_width="45dp" android:layout_height="match_parent" android:background="@drawable/common_tab_bg" android:onClick="back" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginLeft="9dp" android:scaleType="centerInside" android:src="@drawable/our_group_back_on" /> </LinearLayout> <TextView android:id="@+id/name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:textColor="#ffffff" android:textSize="20sp" /> <RelativeLayout android:id="@+id/container_remove" android:layout_width="50dp" android:layout_height="match_parent" android:layout_alignParentRight="true" android:background="@drawable/common_tab_bg" android:onClick="emptyHistory" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_marginRight="9dp" android:scaleType="centerInside" android:src="@drawable/btn_delete" /> </RelativeLayout> <!-- 下面是群组聊天对应的 --> <RelativeLayout android:id="@+id/container_to_group" android:layout_width="50dp" android:layout_height="match_parent" android:layout_alignParentRight="true" android:background="@drawable/common_tab_bg" android:onClick="toGroupDetails" android:visibility="gone" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:scaleType="centerInside" android:src="@drawable/to_group_details_normal" /> </RelativeLayout> </RelativeLayout>
android:visibility="gone"
整体的框架如下:
使用相对布局,View的作用是与上面的布局分开
<View android:layout_width="match_parent" android:layout_height="0.5dp" android:background="@color/gray_normal" />
聊天中,一个是语音模式,一个是键盘输入文字的形式。
所以有两个按钮:
<Button android:id="@+id/btn_set_mode_voice" android:layout_width="32dp" android:layout_height="32dp" android:layout_marginLeft="6dp" android:background="@drawable/chatting_setmode_voice_btn" android:onClick="setModeVoice" android:visibility="visible" /> <Button android:id="@+id/btn_set_mode_keyboard" android:layout_width="32dp" android:layout_height="32dp" android:layout_marginLeft="6dp" android:background="@drawable/chatting_setmode_keyboard_btn" android:onClick="setModeKeyboard" android:visibility="gone" />
<LinearLayout android:id="@+id/btn_press_to_speak" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginBottom="6dp" android:layout_marginLeft="6dp" android:layout_marginRight="6dp" android:layout_marginTop="6dp" android:layout_weight="1" android:background="@drawable/chat_press_speak_btn" android:gravity="center" android:visibility="gone" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="5dp" android:text="@string/button_pushtotalk" android:textColor="#666666" android:textSize="16sp" /> </LinearLayout>
<RelativeLayout android:id="@+id/edittext_layout" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginBottom="3dp" android:layout_marginLeft="6dp" android:layout_marginRight="6dp" android:layout_weight="1" android:gravity="bottom" > <com.dy.ustc.im.ui.widget.PasteEditText android:id="@+id/et_sendmessage" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginRight="35dip" android:background="@null" android:maxLines="3" android:minHeight="40dp" android:onClick="editClick" android:paddingBottom="3dp" android:paddingLeft="1dp" android:paddingRight="1dp" android:paddingTop="3dp" android:textSize="18sp" /> <ImageView android:id="@+id/iv_emoticons_normal" android:layout_width="24dip" android:layout_height="24dip" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_gravity="center_vertical|right" android:layout_margin="1dip" android:scaleType="fitCenter" android:src="@drawable/chatting_biaoqing_btn_normal" android:visibility="visible" /> <ImageView android:id="@+id/iv_emoticons_checked" android:layout_width="24dip" android:layout_height="24dip" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_gravity="center_vertical|right" android:layout_margin="1dip" android:scaleType="fitCenter" android:src="@drawable/chatting_biaoqing_btn_enable" android:visibility="invisible" /> </RelativeLayout>
一个是表情的容器,一个是按钮的容器。
最后一部分的内容:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/root_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#f2f0eb" android:orientation="vertical" > <RelativeLayout android:id="@+id/top_bar" android:layout_width="match_parent" android:layout_height="@dimen/height_top_bar" android:background="@color/common_top_bar_blue" android:gravity="center_vertical" > <LinearLayout android:layout_width="45dp" android:layout_height="match_parent" android:background="@drawable/common_tab_bg" android:onClick="back" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginLeft="9dp" android:scaleType="centerInside" android:src="@drawable/our_group_back_on" /> </LinearLayout> <TextView android:id="@+id/name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:textColor="#ffffff" android:textSize="20sp" /> <RelativeLayout android:id="@+id/container_remove" android:layout_width="50dp" android:layout_height="match_parent" android:layout_alignParentRight="true" android:background="@drawable/common_tab_bg" android:onClick="emptyHistory" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_marginRight="9dp" android:scaleType="centerInside" android:src="@drawable/btn_delete" /> </RelativeLayout> <!-- 下面是群组聊天对应的 --> <RelativeLayout android:id="@+id/container_to_group" android:layout_width="50dp" android:layout_height="match_parent" android:layout_alignParentRight="true" android:background="@drawable/common_tab_bg" android:onClick="toGroupDetails" android:visibility="gone" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:scaleType="centerInside" android:src="@drawable/to_group_details_normal" /> </RelativeLayout> </RelativeLayout> <LinearLayout android:id="@+id/bar_bottom" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:orientation="vertical" android:paddingBottom="2dp" android:paddingTop="2dp" > <View android:layout_width="match_parent" android:layout_height="0.5dp" android:background="@color/gray_normal" /> <LinearLayout android:id="@+id/rl_bottom" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#aaffffff" android:gravity="center_vertical" android:orientation="horizontal" android:paddingTop="4dp" > <Button android:id="@+id/btn_set_mode_voice" android:layout_width="32dp" android:layout_height="32dp" android:layout_marginLeft="6dp" android:background="@drawable/chatting_setmode_voice_btn" android:onClick="setModeVoice" android:visibility="visible" /> <Button android:id="@+id/btn_set_mode_keyboard" android:layout_width="32dp" android:layout_height="32dp" android:layout_marginLeft="6dp" android:background="@drawable/chatting_setmode_keyboard_btn" android:onClick="setModeKeyboard" android:visibility="gone" /> <LinearLayout android:id="@+id/btn_press_to_speak" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginBottom="6dp" android:layout_marginLeft="6dp" android:layout_marginRight="6dp" android:layout_marginTop="6dp" android:layout_weight="1" android:background="@drawable/chat_press_speak_btn" android:gravity="center" android:visibility="gone" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="5dp" android:text="@string/button_pushtotalk" android:textColor="#666666" android:textSize="16sp" /> </LinearLayout> <RelativeLayout android:id="@+id/edittext_layout" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginBottom="3dp" android:layout_marginLeft="6dp" android:layout_marginRight="6dp" android:layout_weight="1" android:gravity="bottom" > <com.dy.ustc.im.ui.widget.PasteEditText android:id="@+id/et_sendmessage" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginRight="35dip" android:background="@null" android:maxLines="3" android:minHeight="40dp" android:onClick="editClick" android:paddingBottom="3dp" android:paddingLeft="1dp" android:paddingRight="1dp" android:paddingTop="3dp" android:textSize="18sp" /> <ImageView android:id="@+id/iv_emoticons_normal" android:layout_width="24dip" android:layout_height="24dip" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_gravity="center_vertical|right" android:layout_margin="1dip" android:scaleType="fitCenter" android:src="@drawable/chatting_biaoqing_btn_normal" android:visibility="visible" /> <ImageView android:id="@+id/iv_emoticons_checked" android:layout_width="24dip" android:layout_height="24dip" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_gravity="center_vertical|right" android:layout_margin="1dip" android:scaleType="fitCenter" android:src="@drawable/chatting_biaoqing_btn_enable" android:visibility="invisible" /> </RelativeLayout> <Button android:id="@+id/btn_more" android:layout_width="32dip" android:layout_height="32dip" android:layout_marginLeft="4dp" android:layout_marginRight="10dp" android:background="@drawable/type_select_btn" android:onClick="more" /> <Button android:id="@+id/btn_send" android:layout_width="42dp" android:layout_height="32dp" android:layout_marginRight="4dp" android:background="@drawable/chat_send_btn_selector" android:onClick="onClick" android:text="@string/button_send" android:textColor="#666666" android:textSize="16sp" android:visibility="gone" /> </LinearLayout> <LinearLayout android:id="@+id/more" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#ffffff" android:orientation="vertical" android:visibility="visible" > <!-- 表情图片 --> <LinearLayout android:id="@+id/ll_face_container" android:layout_width="match_parent" android:layout_height="150dp" android:orientation="vertical" android:visibility="gone" > <android.support.v4.view.ViewPager android:id="@+id/vPager" android:layout_width="match_parent" android:layout_height="wrap_content" /> </LinearLayout> <LinearLayout android:id="@+id/ll_btn_container" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:visibility="visible" > <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginBottom="4dp" android:layout_marginTop="6dp" android:weightSum="4" > <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="64dp" android:layout_height="64dp" > <ImageView android:id="@+id/btn_take_picture" android:layout_width="56dp" android:layout_height="56dp" android:layout_centerInParent="true" android:background="@drawable/chat_takepic_selector" android:clickable="true" android:onClick="onClick" android:scaleType="fitCenter" /> </RelativeLayout> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="@string/attach_take_pic" android:textColor="#727171" /> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="64dp" android:layout_height="64dp" > <ImageView android:id="@+id/btn_picture" android:layout_width="56dp" android:layout_height="56dp" android:layout_centerInParent="true" android:background="@drawable/chat_image_selector" android:clickable="true" android:onClick="onClick" android:scaleType="fitCenter" /> </RelativeLayout> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="@string/attach_picture" android:textColor="#727171" /> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="64dp" android:layout_height="64dp" > <ImageView android:id="@+id/btn_location" android:layout_width="56dp" android:layout_height="56dp" android:layout_centerInParent="true" android:clickable="true" android:onClick="onClick" android:scaleType="fitCenter" android:src="@drawable/chat_location_selector" /> </RelativeLayout> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="@string/attach_location" android:textColor="#727171" /> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="64dp" android:layout_height="64dp" > <ImageView android:id="@+id/btn_video" android:layout_width="56dp" android:layout_height="56dp" android:layout_centerInParent="true" android:clickable="true" android:onClick="onClick" android:scaleType="fitCenter" android:src="@drawable/chat_video_selector" /> </RelativeLayout> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="视频" android:textColor="#727171" /> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginBottom="4dp" android:layout_marginTop="6dp" android:weightSum="4" > <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="64dp" android:layout_height="64dp" > <ImageView android:id="@+id/btn_file" android:layout_width="56dp" android:layout_height="56dp" android:layout_centerInParent="true" android:background="@drawable/chat_file_selector" android:clickable="true" android:onClick="onClick" android:scaleType="fitCenter" /> </RelativeLayout> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="@string/attach_file" android:textColor="#727171" /> </LinearLayout> <LinearLayout android:id="@+id/container_voice_call" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="64dp" android:layout_height="64dp" > <ImageView android:id="@+id/btn_voice_call" android:layout_width="56dp" android:layout_height="56dp" android:layout_centerInParent="true" android:background="@drawable/chat_voice_call_selector" android:clickable="true" android:onClick="onClick" android:scaleType="fitCenter" /> </RelativeLayout> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="@string/attach_voice_call" android:textColor="#727171" /> </LinearLayout> </LinearLayout> </LinearLayout> </LinearLayout> </LinearLayout> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_above="@id/bar_bottom" android:layout_below="@id/top_bar" > <ProgressBar android:id="@+id/pb_load_more" android:layout_width="28dp" android:layout_height="28dp" android:layout_centerHorizontal="true" android:visibility="visible" /> <!-- android:visibility="gone" --> <ListView android:id="@+id/list" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@id/pb_load_more" android:cacheColorHint="#00000000" android:divider="@null" android:dividerHeight="5dp" android:listSelector="#00000000" android:scrollbarStyle="outsideOverlay" android:transcriptMode="normal" /> <RelativeLayout android:id="@+id/recording_container" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:background="@drawable/recording_hint_bg" android:padding="10dp" android:visibility="visible" > <!-- android:visibility="invisible" --> <ImageView android:id="@+id/mic_image" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:src="@drawable/record_animate_01" /> <TextView android:id="@+id/recording_hint" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/mic_image" android:layout_centerHorizontal="true" android:layout_marginTop="5dp" android:padding="2dp" android:text="@string/move_up_to_cancel" android:textSize="10sp" /> </RelativeLayout> </RelativeLayout> </RelativeLayout>
标签:android style blog http ar io color 使用 sp
原文地址:http://blog.csdn.net/chenfuduo_loveit/article/details/41962981