融云Android 2.0 IMkit UI样式更改

对融云Android SDK kit UI相关自定义做了整合方便开发者进行 UI更改

---

1 融云官网推荐的UI 自定义修改

点我跳转自定义文档

官网文档主要介绍了四点 以及 一些自定义

• 会话列表自定义
• 会话界面自定义
• 输入框自定义
• 会话扩展功能自定义

---

2 修改会话界面背景颜色布局 layout/rc_fr_messagelist.xml ListView 的 背景属性此处建议用 .9png 渐变色图片

效果如下:

---

3 圆形头像修改

rc_item_conversation.xml 会话列表
rc_item_message.xml 会话页面
的所有的 AsyncImageView 控件增加 如果有重复冲突的删除掉其他添加下方两处
app:RCShape=”circle”
android:scaleType=”centerCrop”

效果如下:

---

4 修改会话界面对话气泡 颜色 或者 形状需要替换布局文件中的气泡 此处需要是 .9png 图片

效果如下:

---

5 通过修改Kit res 下 rc_theme.xml 来改变部分字体 size 和 样式

<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">

    <style name="RCTheme" parent="@android:style/Theme.Light">
        <item name="android:listDivider">@android:color/transparent</item>
        <item name="android:listSelector">@android:color/transparent</item>
        <item name="android:textColorPrimary">@color/rc_text_color_primary</item>
        <item name="android:textColorSecondary">@color/rc_text_color_secondary</item>
        <item name="android:textColorTertiary">@color/rc_text_color_tertiary</item>
        <item name="android:textColorPrimaryInverse">@color/rc_text_color_primary_inverse</item>
        <item name="android:windowNoTitle">true</item>
    </style>


    <style name="RCTheme.TextView" parent="android:Widget.TextView">

    </style>

    <style name="RCTheme.TextView.Small" parent="RCTheme.TextView">

    </style>

    <style name="RCTheme.TextView.Large" parent="RCTheme.TextView">

    </style>

    <style name="RCTheme.TextView.Medium" parent="RCTheme.TextView">

    </style>

    <style name="RCTheme.TextView.Large.Inverse" parent="RCTheme.TextView.Large">
        <item name="android:textColor">@color/rc_text_color_primary_inverse</item>
    </style>


    <style name="RCTheme.TextView.New" parent="RCTheme.TextView">
        <item name="android:textSize">12sp</item>
        <item name="android:textColor">@color/rc_text_color_primary_inverse</item>
        <item name="android:background">@drawable/rc_unread_count_bg</item>
    </style>

    <style name="RcDialog" parent="@android:style/Theme.Dialog">
        <item name="android:windowFrame">@null</item>
        <item name="android:windowIsFloating">true</item>
        <item name="android:windowIsTranslucent">false</item>
        <item name="android:windowNoTitle">false</item>
        <item name="android:windowBackground">@android:color/transparent</item>
        <item name="android:background">@android:color/transparent</item>
    </style>

    <!--
    size:24px color:#ffffff
    1、会话页面时间 字体
    2、InformationNotificationMessage 字体
    3、DiscussionNotificationMessage 字体
    -->
    <style name="RCTheme.Notification" parent="RCTheme.TextView">
        <item name="android:background">@color/rc_notification_bg</item>
        <item name="android:textSize">12sp</item>
        <item name="android:paddingLeft">8dp</item>
        <item name="android:paddingRight">8dp</item>
        <item name="android:paddingTop">7dp</item>
        <item name="android:paddingBottom">7dp</item>
        <item name="android:textColor">@color/rc_text_color_primary_inverse</item>
    </style>

    <!--
    size:32px color:#353535
    1、TextMessage 字体
    2、RichContentMessage 标题字体
    3、会话列表 title
    -->
    <style name="RCTheme.Message.TextView" parent="RCTheme.TextView">
        <item name="android:textSize">16sp</item>
        <item name="android:textColor">@color/rc_text_color_primary</item>
    </style>
    <!--
    size:24px color:#838383
    消息的用户名
    -->
    <style name="RCTheme.Message.Username.TextView" parent="RCTheme.TextView">
        <item name="android:textSize">14sp</item>
        <item name="android:textColor">@color/rc_message_user_name</item>
        <item name="android:paddingLeft">8dp</item>
    </style>
    <!--
    size:28px color:#999999
    1、RichContentMessage content 字体
    2、会话列表 item message 字体
    3、异常弹出条 字体
    -->
    <style name="RCTheme.Message.RichContent.TextView" parent="RCTheme.TextView">
        <item name="android:textSize">13sp</item>
        <item name="android:textColor">@color/rc_text_color_secondary</item>
    </style>


</resources>

---

6 常用布局文件释义

会话列表	会话界面
rc_fr_conversationlist.xml	rc_fr_messagelist.xml
会话列表item	会话界面item
rc_item_conversation.xml	rc_item_message.xml

---

开发者贡献:
会话列表 item 的颜色修改 : rc_text_color_primary_inverse

---

很多效果 和 样式的修改 不仅仅局限于上面这些方法, 比如我需要去改一个样式 我把 SDK kit 自带的 res 图片替换成和自己APP 主题符合的图片就能实现 , 再比如需要隐藏某个布局 但是无法对源码进行修改可能通过 Gone 或者更改 witht higth 为 0dp 也能实现

如果你有更多更好的关于融云某些样式的修改上面没有提到 , 欢迎在下方留言 。 贡献自己的一份力量 , 让更多开发者因为你而受益！