融云Android 2.0 IMkit UI样式更改

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


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

点我跳转自定义文档

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

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

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

效果如下:

融云Android 2.0 IMkit UI样式更改_第1张图片


3 圆形头像修改

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

效果如下:

融云Android 2.0 IMkit UI样式更改_第2张图片


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

效果如下:

融云Android 2.0 IMkit UI样式更改_第3张图片
融云Android 2.0 IMkit UI样式更改_第4张图片


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



<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
        "android:listSelector">@android:color/transparent
        "android:textColorPrimary">@color/rc_text_color_primary
        "android:textColorSecondary">@color/rc_text_color_secondary
        "android:textColorTertiary">@color/rc_text_color_tertiary
        "android:textColorPrimaryInverse">@color/rc_text_color_primary_inverse
        "android:windowNoTitle">true
    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
    style>


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

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

    
    <style name="RCTheme.Notification" parent="RCTheme.TextView">
        <item name="android:background">@color/rc_notification_bg
        "android:textSize">12sp
        "android:paddingLeft">8dp
        "android:paddingRight">8dp
        "android:paddingTop">7dp
        "android:paddingBottom">7dp
        "android:textColor">@color/rc_text_color_primary_inverse
    style>

    
    <style name="RCTheme.Message.TextView" parent="RCTheme.TextView">
        <item name="android:textSize">16spitem>
        <item name="android:textColor">@color/rc_text_color_primary
    style>
    
    <style name="RCTheme.Message.Username.TextView" parent="RCTheme.TextView">
        <item name="android:textSize">14spitem>
        <item name="android:textColor">@color/rc_message_user_name
        "android:paddingLeft">8dp
    style>
    
    <style name="RCTheme.Message.RichContent.TextView" parent="RCTheme.TextView">
        <item name="android:textSize">13spitem>
        <item name="android:textColor">@color/rc_text_color_secondary
    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 也能实现

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

你可能感兴趣的:(rongcloud,rongcloud集成篇,ui,android,融云,样式,style)