一种聊天界面的实现方式

最新推荐文章于 2024-07-26 09:30:00 发布

wunianisme

最新推荐文章于 2024-07-26 09:30:00 发布

阅读量699

点赞数

CC 4.0 BY-SA版权

分类专栏： Android 文章标签：聊天界面 FrameLayout

本文链接：https://blog.youkuaiyun.com/qq_29645505/article/details/88766660

Android 专栏收录该内容

5 篇文章

订阅专栏

该博客介绍了如何使用FrameLayout布局实现聊天界面，确保输入框在软键盘弹出时不被遮挡。在清单文件中设置windowSoftInputMode为adjustResize，避免界面缩放。用户发送的消息通过LinearLayout动态添加TextView和ImageView。为了保持聊天记录始终滚动到底部，文章讨论了调整ScrollView滚动位置的方法，并提到监听软键盘状态以优化用户体验。

布局采用FrameLayout布局，可以保证软键盘弹出时输入框往上推而不被覆盖。布局文件如下：

< FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"

  xmlns:tools="http://schemas.android.com/tools"

  android:layout_width="match_parent"

  android:layout_height="match_parent"

  android:id="@+id/rootLayout"

  android:background="@color/white">

  < LinearLayout

    android:id="@+id/scrolllayout"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:layout_marginBottom="65dp"

    android:layout_marginTop="60dp"

    android:background="@color/lightgray"

    android:orientation="vertical" >

    < ScrollView

      android:id="@+id/svContent"

      android:layout_width="match_parent"

      android:layout_height="match_parent"

      android:fillViewport="true" >

      < LinearLayout

        android:id="@+id/resultLayout"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:orientation="vertical" >

      < /LinearLayout>

    < /ScrollView>

  < /LinearLayout>

  < View

    android:layout_width="match_parent"

    android:layout_height="2dp"

    android:layout_gravity="bottom"

    android:layout_marginBottom="65dp"

    android:background="@color/gray"/ >

  < LinearLayout

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

    android:minHeight="60dp"

    android:focusable="true"

    android:focusableInTouchMode="true"

    android:layout_gravity="bottom|center"

    android:gravity="center_vertical"

    android:layout_marginRight="2dp"

    android:orientation="horizontal" >

    < com.wunian.widget.ClearEditText

      android:id="@+id/etEditor"

      android:layout_width="0dp"

      android:layout_height="wrap_content"

      android:minHeight="40dp"

      android:gravity="center_vertical"

      android:layout_weight="4"

      android:hint="请输入聊天内容"

      android:drawableRight="@drawable/ic_delete"

      android:maxHeight="200dp"

      android:inputType="textMultiLine"

     android:minLines="1"

      android:maxLines="5"/ >

    < Button

      android:id="@+id/btnSubmit"

      android:layout_width="0dp"

      android:layout_height="40dp"

      android:layout_weight="1"

      android:gravity="center"

      android:background="@drawable/btn_bg"

      android:textColor="@color/white"

      android:text="发送"/ >

  < /LinearLayout> 

< /FrameLayout>

同时，在清单文件中，设置windowSoftInputMode为adjustResize(主界面不会缩放,会向上移来放置软键盘)或不设置，千万不能设置为adjustPan(主界面会进行缩放来放置软键盘)：

< activity

      android:name="com.wunian.littlewei.LittleWeiChatActivity"

      android:label="@string/app_name"

      android:windowSoftInputMode="adjustResize" >

用户发送的聊天对话框可以动态生成（linearlayout addTextView,ImageView）。

为了保证中间的聊天记录每发一条都能滚动到底部，需要设置ScrollView的滚动位置。

有两种方式可以使ScrollView滚动到底部：

public void ScrollToBottom() {//方式一

handler.post(new Runnable() {

@Override

public void run() {

scroll.fullScroll(ScrollView.FOCUS_DOWN);

}

});

}

public void scrollToBottom2() {//方式二

handler.post(new Runnable() {

public void run() {

if (scroll == null || linearLayout == null) {

return;

}

int offset = linearLayout.getMeasuredHeight() - scroll.getHeight();

if (offset < 0) {

offset = 0;

}

scroll.scrollTo(0, offset);

}

});

}

还要监听软键盘弹起或隐藏状态，在软键盘弹起时对ScrollView进行滚动：

// 1776-1557 未弹起 //1776-829 弹起

public void addSoftInputListener(final View rootLayout) {

// final View rootLayout = findViewById(R.id.rootLayout);

rootLayout.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {

@Override

public void onGlobalLayout() {

int heightDiff = rootLayout.getRootView().getHeight()

- rootLayout.getHeight();

// rootLayout.getHeight()>svContainer.getHeight()

if (heightDiff > dpToPx(context, 200)) { // 600px

// 显示软键盘

// ScrollToBottom();

scrollToBottom2();

} else {

// 隐藏软键盘

}

}

//此方法用于将dp转换为px

public float dpToPx(Context context, float valueInDp) {// 1dp=3px

DisplayMetrics metrics = context.getResources()

.getDisplayMetrics();

return TypedValue

.applyDimension(TypedValue.COMPLEX_UNIT_DIP,

valueInDp, metrics);

}

});

}