UIKit allows all types of message bubble to be replaced
Text Message Bubble
Image Massage Bubble
Audio Message Bubble
Usage
To customize message bubble, implement AmityMessageListAdapter.CustomViewHolder and pass a custom ViewHolder for the corresponding message type.
class MainActivity : AppCompatActivity(), AmityMessageListAdapter.CustomViewHolder {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
/**
* Implement [AmityMessageListAdapter.CustomViewHolder] if customization is required for messageViews
* set the customView listener using [AmityChatRoomFragment] instance
*/
val chatRoomFragment = AmityChatRoomFragment
.newInstance("channelId")
.enableChatToolbar(boolean)
.customViewHolder(this)
.build(this)
val transaction = supportFragmentManager.beginTransaction()
transaction.replace(R.id.fragmentContainer, messageListFragment)
transaction.addToBackStack(null)
transaction.commit()
}
}
Override methodgetViewHolder()to pass a custom ViewHolder
override fun getViewHolder(
inflater: LayoutInflater,
parent: ViewGroup,
viewType: Int
): AmityChatMessageBaseViewHolder? {
return when(viewType) {
MessageType.MESSAGE_ID_TEXT_RECEIVER -> TextReceiverViewHolder(
inflater.inflate(R.layout.custom_item_text_receiver, parent, false), EkoChatMessageBaseViewModel())
MessageType.MESSAGE_ID_TEXT_SENDER -> TextSenderViewHolder(
inflater.inflate(R.layout.custom_item_text_sender, parent, false), EkoChatMessageBaseViewModel()
)
//pass null for all the types where no customisation is required
//Default UIKIT Ui will be rendered for all those types
else -> null
}
}
Using Your Own Component
UIKIT allows some parts of the component to be customized.