How to make images in WKInterfacePicker Transparent?

Question

I have a WKInterfacePicker which is set to Sequence mode. When i add images to it during runtime and display it on the apple watch, the images seems to have a black background (instead of having the transparent pixels). The Images have transparent pixels in them. Here is the code i used in willActivate function:

NSMutableArray *pItems = [[NSMutableArray alloc] initWithCapacity:31];

for(int i=0; i<30; ++i){
    WKPickerItem *item = [[WKPickerItem alloc] init];
    WKImage *img = nil;
    if(i < 10)
        img = [WKImage imageWithImageName:[NSString stringWithFormat:@"safeDial_0%d", i]];
    else
        img = [WKImage imageWithImageName:[NSString stringWithFormat:@"safeDial_%d", i]];

    [item setContentImage:img];
    [pItems addObject:item];
}

[self.pickerSafeLock setItems:[pItems copy]];
[self.pickerSafeLock setSelectedItemIndex:0];
[self.pickerSafeLock focus];

Note: pickerSafeLock is the WKInterfacePicker

Also, when i use the same images on a WKImage, i see that the transparent pixels work fine.

Is there a way to make the Images in WKInterfacePicker transparent?

Answer 1

After trying multiple ways (including @DaGaMs's solution), i found an considerably tricky solution to the problem. I have used a WKInterfacePicker and an associated WKInterfaceImage alongside it. Here is a way to overcome the issue:

In the Storyboard of your WatchKit App add a WKinterfaceImage, WKInterfaceGroup and WKInterfacePicker inside a WKInterfaceGroup.

Here is how it would look:

This is just to hide the Picker offscreen, so that we can fake the animation from the Picker to the WKInterfaceImage.

Once you do this, on the IBAction of WKInterfacePicker set the corresponding images like this:

- (IBAction)pickerAction:(NSInteger)value {
    [self.yourWKInteraceImage setImage:imgPickerList[value]];
}

Note: imgPickerList contains all the images that you want to animate (same as the Picker).