Message bubbles

Before ready(), you can tune bubble radius, colors, left/right layout, and whether names or avatars show in direct vs group channels. Types are MessageBubbleConfig and BubbleLayout.

Main options

Field	Description
redius	Corner radius in pixels (note the SDK-exported spelling redius).
layout	BubbleLayout: LEFT_RIGHT or LEFT_JUSTIFYING.
backgroundColorForMyself / backgroundColorForOthers	Fill colors as hex integers (e.g. 0x007AFF).
textColorForMyself / textColorForOthers	Text colors as hex integers.
showMyProfileInDirectionChannel, showMyNameInDirectionChannel	Visibility of your own avatar and name in direct channels. The property name keeps the SDK's exported Direction spelling.
showMyProfileInGroupChannel, showMyNameInGroupChannel	Visibility of your own avatar and name in group channels.
showOthersProfileInDirectionChannel, showOthersNameInDirectionChannel	Visibility of the other user's avatar and name in direct channels. The property name keeps the SDK's exported Direction spelling.
showOthersProfileInGroupChannel, showOthersNameInGroupChannel	Visibility of other users' avatar and name in group channels.

Default values

• redius: 20
• layout: BubbleLayout.LEFT_RIGHT
• backgroundColorForMyself: 0xD2E1FE
• backgroundColorForOthers: 0xF3F5FA
• textColorForMyself: 0x020814
• textColorForOthers: 0x020814
• showMyProfileInDirectionChannel: true
• showMyProfileInGroupChannel: true
• showOthersProfileInDirectionChannel: true
• showOthersProfileInGroupChannel: true
• showOthersNameInGroupChannel: true

Read and write

TypeScript

import { BubbleLayout } from '@nexconn/chatui';

const config = app.cloneMessageBubbleConfig();
config.layout = BubbleLayout.LEFT_RIGHT;
app.setMessageBubbleConfig(config);

tip

Read and set the bubble config before app.ready().