transparency on label image blob

You must Login before you can answer or comment on any questions.

Hi,

So I want to make a dashboard view from text labels, and have managed to do that through label.toImage() but if I set the borderRadius there are no transparency in the blob. is there a workaround?

4 Answers

Accepted Answer

I have patched the TUIDashboardView.m so I can add on my dashboard dynamic created images (with rendered textlabels) and a pressed image....

Is someone intersted in that?

— answered 2 years ago by Marc Bender
answer permalink
8 Comments

  • yes. very much so! ;)

    I'm so disappointed with how useless the dashboardview is at the moment.

    — commented 2 years ago by Kosso .

  • I will add you a demo and maybe that could find its way to kitchensink.... and in the repository...

    — commented 2 years ago by Marc Bender

  • personally I won't use it (since i have the worst memory, if i upgrade titanium, forgot all about the patch, i'll go nuts)

    but do share, and I'll put it as the best answer.

    — commented 2 years ago by soemarko ridwan

  • Show 5 more comments

nvm,,, apparently I can just add a LabelView to DashboardItem and all good..

Appcelerator really should update their docs!

— answered 2 years ago by soemarko ridwan
answer permalink
3 Comments

  • i've also found that trying to position the label in the dashboardItem doesn't seem to do what I tell it to!

    argh!

    — commented 2 years ago by Kosso .

  • try my code snippet up there, if you add the label to a view, and the view to dashboard item, it'll work

    — commented 2 years ago by soemarko ridwan

  • I tried that a while ago, but I do it like this:

    function createDashboardItem(label, image, selectedImage, canDel){
    var item = Ti.UI.createDashboardItem({
        image:image,
        selectedImage:selectedImage,
        canDelete:canDel
    });
 
    var container = Ti.UI.createView({
        height:70,
        width:70,
        borderWidth:4,
        borderRadius:6,
        backgroundColor:'#ff9900'
    });
 
    var some_label = Ti.UI.createLabel({
        text:label,
        textAlign:'center',
        color:'black',
        font:{fontSize:10},
        height:15,
        width:65
    });
 
    container.add(some_label);
 
    item.add(container);
 
    container.addEventListener('click',function(){
        Ti.API.info('hello from the container click.  (this never happens)');
    });
 
    return item;
}
    but the container never gets the click (or touch) event, so you can't show that it's being clicked.

    — commented 2 years ago by Kosso .

Hi, Good idea using the toImage on labels. I hadn't thought of that.

I've spent quite some time recently looking as using a dashboardView for a project I want to build, but the lack of dynamic labels is infuriating! I also found that using views/buttons/labels instead of the images in the documentation killed a lot of the events inside the items, so I was unable to even create up/down button 'states'.

Now you've inspired me to have a go at using toImage from a label. I'll see what I can come with to deal with the borderRadius/transparency.

Before I do that, how about trying the imageAsThumbnail() function, which has an option parameter for radius already in it? (Along with a border option and square size)

— answered 2 years ago by Kosso .
answer permalink
1 Comment

  • lol.. since the docs only has image / selected image and nothing else... it's actually the first thing i thought of.

    — commented 2 years ago by soemarko ridwan

I find that if I add a label to a DashboardItem, I lose the image/selectedImage

infuriating!

have you managed to get around this somehow? care to share a snip of code? ;)

— answered 2 years ago by Kosso .
answer permalink
4 Comments

  • i think i'd live without the selected image... and i just do all the design from the view. 

    var view = Ti.UI.createView({
    backgroundColor: '#ccc',
    borderRadius: 2,
    height: 85,
    width: 75
});
 
var lab = Ti.UI.createLabel({
    shadowColor: '#fefefe',
    shadowOffset: {x: 0,y: 1},
    text: labels[c],
    textAlign: 'center'
});
 
var item = Ti.UI.createDashboardItem({});
 
view.add(lab);
item.add(view);
 
if (c==3) { item.badge = 10; }
data.push(item);

    — commented 2 years ago by soemarko ridwan

  • I tried using a view and I could get it to look how I wanted it to look. UNTIL I wanted a selected state to the image/view/button. It doesn't want to send out any touch/click events at all. I think the item itself consumes them all - and the views/labels inside the item cannot be referenced or changed to do that programattically.

    — commented 2 years ago by Kosso .

  • use another variable to keep track of the states? your app sound complicated. mine just open another window when a dashboard item is selected. just a better ui for the case than the overused tableview.

    — commented 2 years ago by soemarko ridwan

  • Show 1 more comment

Your Answer

Think you can help? Login to answer this question!