B4A Library ChatMessageView

This is a wrap for this Github project.

ChatMessageView
Author: DonManfred (wrapper)
Version: 1
ChatView
Events:

• onSendClicked (v As View)

Fields:

• ba As anywheresoftware.b4a.BA

Methods:

• hideKeyboard As void
  Hide software keyboard
• DesignerCreateView (base As anywheresoftware.b4a.objects.PanelWrapper, lw As anywheresoftware.b4a.objects.LabelWrapper, props As anywheresoftware.b4a.objects.collections.Map) As void
• IsInitialized As boolean
• Initialize (ba As anywheresoftware.b4a.BA, EventName As java.lang.String) As void
• BringToFront As void
• SetLayout (arg0 As int, arg1 As int, arg2 As int, arg3 As int) As void
• SendToBack As void
• SetVisibleAnimated (arg0 As int, arg1 As boolean) As void
• receive (message As jp.bassaer.chatmessageview.models.Message) As void
• RemoveView As void
• Invalidate3 (arg0 As int, arg1 As int, arg2 As int, arg3 As int) As void
• Invalidate2 (arg0 As android.graphics.Rect) As void
• SetColorAnimated (arg0 As int, arg1 As int, arg2 As int) As void
• SetBackgroundImage (arg0 As android.graphics.Bitmap) As void
• Invalidate As void
• send (message As jp.bassaer.chatmessageview.models.Message) As void
• SetLayoutAnimated (arg0 As int, arg1 As int, arg2 As int, arg3 As int, arg4 As int) As void
• RequestFocus As boolean

Properties:

• Left As int
• Parent As java.lang.Object [read only]
• InputText As java.lang.String
• DateSeparatorColor As int [write only]
• InputTextHint As java.lang.String [write only]
• LeftMessageTextColor As int [write only]
• Visible As boolean
• Padding As int[]
• SendButtonColor As int [write only]
• Height As int
• Width As int
• RightBubbleColor As int [write only]
• Background As android.graphics.drawable.Drawable
• UsernameTextColor As int [write only]
• Color As int [write only]
• Enabled As boolean
• SendTimeTextColor As int [write only]
• SendIcon As int [write only]
• AutoScroll As boolean [write only]
  Auto Scroll when message received.
• LeftBubbleColor As int [write only]
• Top As int
• RightMessageTextColor As int [write only]
• Tag As java.lang.Object
• BackgroundColor As int [write only]

MessageBuilder
Methods:

• setMessageText (messageText As java.lang.String) As de.donmanfred.MessageBuilderWrapper
• setRightMessage (isRight As boolean) As de.donmanfred.MessageBuilderWrapper
• IsInitialized As boolean
• Initialize (ba As anywheresoftware.b4a.BA, EventName As java.lang.String) As void
• setUserIcon (icon As android.graphics.Bitmap) As de.donmanfred.MessageBuilderWrapper
• setCreatedAt (calendar As java.util.Calendar) As de.donmanfred.MessageBuilderWrapper
• setDateCell (isDateCell As boolean) As de.donmanfred.MessageBuilderWrapper
• setUserName (userName As java.lang.String) As de.donmanfred.MessageBuilderWrapper
• build As jp.bassaer.chatmessageview.models.Message

MessageView
Fields:

• ba As anywheresoftware.b4a.BA

Methods:

• DesignerCreateView (base As anywheresoftware.b4a.objects.PanelWrapper, lw As anywheresoftware.b4a.objects.LabelWrapper, props As anywheresoftware.b4a.objects.collections.Map) As void
• IsInitialized As boolean
• Initialize (ba As anywheresoftware.b4a.BA, EventName As java.lang.String, messages As java.util.ArrayList) As void
• BringToFront As void
• SetLayout (arg0 As int, arg1 As int, arg2 As int, arg3 As int) As void
• SendToBack As void
• init2 As void
  Initialize list
• SetVisibleAnimated (arg0 As int, arg1 As boolean) As void
• init (messages As anywheresoftware.b4a.objects.collections.List) As void
• RemoveView As void
• Invalidate3 (arg0 As int, arg1 As int, arg2 As int, arg3 As int) As void
• Invalidate2 (arg0 As android.graphics.Rect) As void
• SetColorAnimated (arg0 As int, arg1 As int, arg2 As int) As void
• SetBackgroundImage (arg0 As android.graphics.Bitmap) As void
• scrollToEnd As void
• Invalidate As void
• SetLayoutAnimated (arg0 As int, arg1 As int, arg2 As int, arg3 As int, arg4 As int) As void
• RequestFocus As boolean

Properties:

• RightBubbleColor As int [write only]
• Left As int
• Message As jp.bassaer.chatmessageview.models.Message [write only]
• Background As android.graphics.drawable.Drawable
• UsernameTextColor As int [write only]
• Parent As java.lang.Object [read only]
• Color As int [write only]
• Enabled As boolean
• SendTimeTextColor As int [write only]
• LeftBubbleColor As int [write only]
• LeftMessageTextColor As int [write only]
• Top As int
• Visible As boolean
• RightMessageTextColor As int [write only]
• Padding As int[]
• Height As int
• Tag As java.lang.Object
• Width As int
• DateSeparatorTextColor As int [write only]

Message
Methods:

• isDateCell As boolean
• initDate As void
• isRightMessage As boolean
• IsInitialized As boolean
• Initialize (ba As anywheresoftware.b4a.BA, EventName As java.lang.String) As void

Properties:

• RightMessage As boolean [write only]
• TimeText As java.lang.String
• UserName As java.lang.String
• UserIcon As android.graphics.Bitmap
• CreatedAt As java.util.Calendar
• MessageText As java.lang.String
• DateCell As boolean [write only]
• CompareCalendar As java.util.Calendar [read only]
  Return Calendar to compare the day <br>
  Reset hour, min, sec, milli sec.<br>
• DateSeparateText As java.lang.String

Code:

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.

    Private chat As ChatView
    'Private msgview As MessageView
    Private builder As MessageBuilder
End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("Layout1")
 
    Dim bmp As Bitmap
    bmp.Initialize(File.DirAssets,"DonManfred.png")
 
 
 
    Dim messages As List
    messages.Initialize

    Dim msg As Message
    builder.Initialize("")
    msg = builder.setUserIcon(bmp).setMessageText("Hallo B4X-World! :-)").setRightMessage(False).setUserName("DonManfred").build
    messages.Add(msg)
    chat.send(msg)

    Dim msg As Message
    builder.Initialize("")
    msg = builder.setMessageText("Hallo Manfred!").setRightMessage(True).setUserName("Someone").build

    messages.Add(msg)
 
    'msgview.init(messages)
    'msgview.Message = msg
 
    chat.send(msg)
 
    chat.AutoScroll = True
    chat.BackgroundColor = Colors.LightGray
    chat.DateSeparatorColor = Colors.Blue
    chat.InputTextHint = "This is the hint"
    chat.BackgroundColor = Colors.DarkGray
    chat.LeftBubbleColor = Colors.ARGB(255,128,64,64)
    chat.RightBubbleColor = Colors.ARGB(255,64,128,128)
    chat.LeftMessageTextColor = Colors.Red
    chat.RightMessageTextColor = Colors.Magenta
End Sub

 

Really great job dear Don.

 

Wow you are the best!
Just in time I needed this
Thanks a lot Manfred

 

Feel free to donate a big amount of $ then

 

Hi Don, a few question.

A) When i click point 1



i have this result in Log Window:

also if i have this code

Code:

Sub chat_onSendClicked(v As View)
    Log("TEST")
End Sub

where i wrong ??

B. Is possible change property as colour text for point 2 ?

Thank you

 

Ok the second point you can solve it by working on resources

1. Folder: res.ChatMessageView\values\colors.xml you can add this line:

2. Folder: res.ChatMessageView\layout\chat_view.xml you have:

Code:

<LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="@dimen/icon_normal"
        android:background="@color/blueGray50"
        >

change last line with:

Code:

<LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="@dimen/icon_normal"
        android:background="@color/blueGrayBlack"
        >

3. in you code B4A add this line:

Code:

chat.SendButtonColor = Colors.White

and you will be this effect:

 

About point 1..i think that is necessary that you see wrapper.

 

for now. ADD a second sub

Code:

Sub chat_onSendClick(v As View)
    Log("TEST")
End Sub

the lib is searching for this name but it is raising the other...

 

With this code:

Code:

Sub chat_onSendClicked(v As View)
    Log("TEST")
End Sub

Sub chat_onSendClick(v As View)
    Log("TEST")
End Sub

I have this error:

 

And with this code:

Code:

Sub chat_onSendClick(v As View)
    Log("TEST")
End Sub

i have this error:

Ok. Dont worry.... you need time.
Thank you

 

ok, i´ll update the lib soon.
change the sub to

Code:

Sub chat_onSendClicked(text As String)
    Log($"chatv_onSendClicked(${text})"$)
End Sub

for the next version....

 

V1.01 updated in post #1

 

Some issues:
1) The text bubble resize itself when I open the keyboard and glitches. Also it stays resized after I close the keyboard.

2) Messages.clear does not really clear the messages. Should I call something along with this?

3) how can I move the bubbles more to the edge of the screen? Because its a bit too centered and the text have small width and big height

4) how can i change the edittext text color? cant find anything in the xml files

 

Hi dear Don. Now work



Great Work

 

You forgot to change the user!

 

Point 1 can yuo send example ?
Point 2 Message.clear "clear" only object list and no chat. if you want delete all you can use this code:

Code:

chat.RemoveView
Activity.LoadLayout("Layout1")

Point 3 I dont see this property / method :

Code:

//Set UI options
    mChatView.setRightBubbleColor(ContextCompat.getColor(this, R.color.deepOrange500));
    mChatView.setLeftBubbleColor(Color.WHITE);
    mChatView.setBackgroundColor(ContextCompat.getColor(this, R.color.blueGray700));
    mChatView.setSendButtonColor(ContextCompat.getColor(this, R.color.cyan500));
    mChatView.setSendIcon(R.drawable.ic_action_send);
    mChatView.setRightMessageTextColor(Color.WHITE);
    mChatView.setLeftMessageTextColor(Color.BLACK);
    mChatView.setUsernameTextColor(Color.WHITE);
    mChatView.setSendTimeTextColor(Color.WHITE);
    mChatView.setDateSeparatorColor(Color.WHITE);
    mChatView.setInputTextHint("new message...");

but if you want you can change size char.
dimens.xml

Point 4

Code:

chat.LeftMessageTextColor
chat.RightMessageTextColor

 

Of course i talk often with myself

 

1)I'm gonna send an example in a while. Is a pic OK?(the github project has an update maybe this can solve it)
2) thanks I'm gonna remove the view and recreate it then.
3)OK I'll mess a bit with the xmls then see what I can change
4) no, I mean the font color of the edittext, I have changed the textbox to white and the default font color is White too so I can't see it

Thanks Marco
,appreciate your help

 

I think that dear Don already use the last project. But about this question only he can answer

 

@DonManfred
good morning.
its possible send a audio, video and image?
if no, its possible u add this to the lib?

thx