Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to change conversation layout? #60

Open
hungnd opened this issue Nov 21, 2012 · 3 comments
Open

How to change conversation layout? #60

hungnd opened this issue Nov 21, 2012 · 3 comments

Comments

@hungnd
Copy link

hungnd commented Nov 21, 2012

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?

@pec1985
Copy link
Owner

pec1985 commented Nov 21, 2012

@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.

@hungnd
Copy link
Author

hungnd commented Nov 22, 2012

Good job, Pedro.

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

@sindresorhus
Copy link
Contributor

@pec1985 any updates on this rewrite?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants