标签: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