Skip to content

How to change conversation layout? #60

@hungnd

Description

@hungnd

Your product is perfect, but I need customize more.
Ex: I want to write a page like facebook chatting. Each message contains a user image, user name, and hisl/her message. I try to do it by 2 ways, but all are impossible.

  1. Use textArea.add() method:
textArea.addEventListener('buttonClicked', function(e){
    // fires when clicked on the send button
    var view = Ti.UI.createView({...});
    var profileImg = Ti.UI.createImageView({...});
    var profileName = Ti.UI.createLabel({...});
    var comment = Ti.UI.createLabel({...});
    view.add(profileImg);
    view.add(profileName);
    view.add(comment);
    textArea.add(view);
});

The textField has transparent background, so I can see textArea content through textField. And textArea does not auto scroll to bottom when a new message's added.

  1. Set transparent message, convert view to image
var textArea = Ti.SMSView.createView({
    backgroundColor: '#dae1eb', // <--- Defaults to #dae1eb
    assets: 'assets',           // <--- Defauls to nothing, smsview.bundle can be placed in the Resources dir
    sendColor: 'trasparent',        // <--- Defaults to "Green"
    recieveColor: 'trasparent', // <--- Defaults to "White"
});
textArea.addEventListener('buttonClicked', function(e){
    // fires when clicked on the send button
    var view = Ti.UI.createView({...});
    var profileImg = Ti.UI.createImageView({...});
    var profileName = Ti.UI.createLabel({...});
    var comment = Ti.UI.createLabel({...});
    view.add(profileImg);
    view.add(profileName);
    view.add(comment);

    var image = Ti.UI.createImageView({image : view.toImage()});
    textArea.sendMessage(image.toBlob());
});

But there is only profile image showed with small size.

So is there a way to create a conversation like facebook chatting?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions