当前位置:操作系统 > 安卓/Android >>

仿微信聊天气泡效果实现

微信聊天窗口的信息效果类似iphone上的短信效果,以气泡的形式展现,在Android上,实现这种效果主要用到ListView和BaseAdapter,配合布局以及相关素材,就可以自己做出这个效果,素材可以下一个微信的APK,然后把后缀名改成zip,直接解压,就可以得到微信里面的所有素材了。首先看一下我实现的效果:
                                           
 
 
 
  以下是工程目录结构:
                                           
 
 
 
  接下来就是如何实现这个效果的代码:
   main.xml,这个是主布局文件,显示listview和上下两部分内容。
   <?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:background="#f0f0e0" >
 
    <RelativeLayout 
        android:id="@+id/rl_top"
         android:layout_width="fill_parent"
         android:layout_alignParentTop="true"
      android:layout_height="wrap_content">
         <TextView 
            android:layout_width="fill_parent"
       android:layout_height="44dp"
       android:gravity="center"
       android:textSize="18sp"
       android:background="#486a9a"
       android:textColor="@android:color/white"
       android:text="Chat"/>
     </RelativeLayout>
     
    <RelativeLayout 
        android:id="@+id/rl_bottom"
         android:layout_alignParentBottom="true"
         android:layout_width="fill_parent"
         android:background="#486a9a"
         android:paddingTop="5dp"
      android:layout_height="wrap_content">
         
         <Button
             android:id="@+id/btn_send"
             android:layout_width="70dp"
             android:layout_height="50dp"
             android:layout_alignParentRight="true"
             android:layout_centerVertical="true"
             android:layout_marginRight="10dp"
             android:text="Send" />
         
         <EditText 
            android:id="@+id/et_content"
             android:layout_width="fill_parent"
             android:layout_height="50dp"
             android:layout_centerVertical="true"
             android:layout_marginLeft="10dp"
             android:layout_marginRight="10dp"
             android:layout_toLeftOf="@id/btn_send"
             android:textSize="16sp"/>
     </RelativeLayout>
     
    <ListView 
        android:id="@+id/listview"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent"
         android:layout_above="@id/rl_bottom"
         android:layout_below="@id/rl_top"
         android:layout_marginLeft="10dp"
         android:layout_marginRight="10dp"
         android:layout_marginTop="10dp"
         android:cacheColorHint="#00000000"
         android:divider="@null"
         android:listSelector="#00000000"
         android:dividerHeight="3dp"
         android:scrollbars="none"/>
     
</RelativeLayout>
 然后就是listview中两种类型item的布局文件,分别是接收信息的item效果和发送信息的item效果
   
   chat_from_item.xml是接收信息的item布局:
   <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="fill_parent"
     android:orientation="vertical"
     android:paddingBottom="5dp"
     android:layout_height="wrap_content" >
 
    <TextView
          android:id="@+id/tv_time"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_gravity="center_horizontal"
             android:background="#bfbfbf"
             android:paddingTop="2dp"
             android:paddingBottom="2dp"
             android:paddingLeft="4dp"
             android:paddingRight="4dp"
             android:textColor="#ffffff"
             android:textSize="12sp" />
     
    <RelativeLayout
         android:layout_wi
补充:移动开发 , Android ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,