TiSMSView icon indicating copy to clipboard operation
TiSMSView copied to clipboard

How to change conversation layout?

Open hungnd opened this issue 12 years ago • 3 comments

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?

hungnd avatar Nov 21 '12 11:11 hungnd

@hungnd Thanks for writing. Unfortunately this is not available yet. I'm working on a rewrite of this module to make it more dynamic and performant. I'm plaining on releasing it at the end of the year.

pec1985 avatar Nov 21 '12 17:11 pec1985

Good job, Pedro.

Thank you, I'm waiting for. Hope it releases soon.

hungnd avatar Nov 22 '12 06:11 hungnd

@pec1985 any updates on this rewrite?

sindresorhus avatar Apr 21 '13 17:04 sindresorhus