Adding Images to UIActionSheet buttons as in UIDoc

Question

Is it possible to add an image to the buttons of the UIActionSheet as seen in UIDocumentInteractionController? If so, please let me know how it is done.

Answer 1

Try this way, i hope it may be help you.

UIActionSheet * action = [[UIActionSheet alloc] 
                      initWithTitle:@"Title" 
                      delegate:self 
                      cancelButtonTitle:@"Cancel" 
                      destructiveButtonTitle:nil 
                      otherButtonTitles:@"",nil];

[[[action valueForKey:@"_buttons"] objectAtIndex:0] setImage:[UIImage imageNamed:@"yourImage.png"] forState:UIControlStateNormal];

[[[action valueForKey:@"_buttons"] objectAtIndex:0] setImage:[UIImage imageNamed:@"yourImage_Highlighted.png"] forState:UIControlStateHighlighted];

Answer 2

I found this category extension works in ios7.1 to add an image/icon to the buttons in a UIActionSheet, with some caveats...

@interface UIActionSheet (GSBActionSheetButtons)
- (void)buttonAtIndex:(NSUInteger)index setImage:(UIImage *)image forState:(UIControlState)state;
@end

@implementation UIActionSheet (GSBActionSheetButtons)
- (void)buttonAtIndex:(NSUInteger)index setImage:(UIImage *)image forState:(UIControlState)state
{
    for (UIView* view in self.subviews) {
        if ([view isKindOfClass:[UIButton class]]) {
            if (index-- == 0) {
                UIButton *button = (UIButton*)view;
                [button setImage:image forState:state];
                button.imageView.contentMode = UIViewContentModeScaleAspectFit;
                button.imageEdgeInsets = UIEdgeInsetsMake(2,0,2,0);
                break;
            }
        }
    }
}

And to use it:

[self.sharePopup buttonAtIndex:2 setImage:[UIImage imageNamed:@"twitter.png"] forState:UIControlStateNormal];

The caveats:

• Although the UIActionSheet does correctly autosize your image to the right height for the button, it does not appear to correspondingly change the imageview width; hence the need for the UIViewContentModeScaleAspectFit to prevent the image from getting squished. However, the imageview frame width is still the original full-size, so if your image was big (or more precisely wide) then you'll get an annoying gap between the centered (shrunk) image and the button text. I've found no way around this; even programmatically adding an explicit width=height constraint to the imageview seems to be ignored!? [any ideas?]. Net outcome, make sure your image is about the right height to begin with (eg about 45 pixels on a iPhone 4S) or you'll get an increasingly large gap between the button image and text.

• More serious, as soon as you add an image to the button, the UIActionSheet seems to automatically cause the button's text to be bolded (!). I dont know why and dont know how to prevent this [any ideas?]

• Lastly, this solution relies on the UIActionSheet's subviews to be in the same order as the button are indexed. This is true for a handful of buttons, but (apparantly) when you have a lot of items in your UIActionSheet Apple mucks about with the indexing [but you'll have problems with this anyway in actionSheet:clickedButtonAtIndex: when you try to figure out which button was tapped...]

Oh, the imageEdgeInsets: is optional - I inset each image a couple pixels inside the button so that the images dont touch each other vertically.

[Opinion: given the above oddities, I get the feeling Apple really doesn't want people mucking about with their action sheets. At some point you'll probably have to bite-the-bullet and just implement your own modal popup; there's only so much manhandling these UIActionSheets will accommodate...]

Answer 3

    NSString* strUrl=[MLControl shared].currentServerUrl;
    for( MLServerUrl *title in [MLControl shared].arrServerUrl)  {
        NSString* strShow=title.name;
        if ([strUrl isEqualToString: title.url]) {
            strShow=[NSString stringWithFormat:@"√ %@",strShow];
        }else{
            strShow=[NSString stringWithFormat:@"  %@",strShow];
        }

        [chooseImageSheet addButtonWithTitle:strShow];
    }

   // [[[chooseImageSheet valueForKey:@"_buttons"] objectAtIndex:0] setImage:[UIImage imageNamed:@"ic_check_black_18dp.png"] forState:UIControlStateNormal];
    chooseImageSheet.actionSheetStyle = UIActionSheetStyleDefault;
    [chooseImageSheet showFromRect:btnRc inView:sender animated:YES];

Answer 4

The standard UIActionSheet doesn't support images.

One way to add an image to the UIActionSheet is to add a subview to the UIActionSheet. Just implement the UIActionSheetDelegate method willPresentActionSheet: like this:

- (void)willPresentActionSheet:(UIActionSheet *)actionSheet {
     UIImageView* buttonImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"picturename.png"]];
     // Set the frame of the ImageView that it's over the button.
     [actionSheet addSubview:buttonImage];
     [buttonImage release]; // only if you don't need this anymore
}

I'm not sure if the image responds to touches, but you can build a UIActionSheet like theUIDocumentInteractionController.

Answer 5

I just created a class emulating the look of an UIActionSheet using table cells supporting images and text for every row. It also uses blocks for interaction, supports iPhone and iPad, popup from an UITabBarItem on iPad and queueing of multiple sheets. Still in development, but feel free to clone it from Github:

http://github.com/azplanlos/SIActionSheet

Usage is quite simple, here is an example:

SIActionSheet* mySheet = [SIActionSheet actionSheetWithTitle:@"Action Sheet title"
    andObjects:[NSArray arrayWithObjects:
        [SIActionElement actionWithTitle:@"Item 1"
            image:[UIImage imageNamed:@"image"]
            andAction:^{NSLog(@"action 1");}]
    , nil]
    completition:^(int num) {
        NSLog(@"pressed %i", num);
    } cancel:^{NSLog(@"canceled");}];

mySheet.followUpSheet = anotherSheet;
if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone)
        [mySheet show];
else
        [mySheet showFromTabBarItem:item inTabBar:tabBar];

If you encounter any problems, please let me know. I hope this helps a lot of people having the same problem like me...

Answer 6

I know it's very late answer, but I found another way to show image in action sheet:

self.actionSheet = [[UIActionSheet alloc] initWithTitle:@"Select Image:" delegate:self cancelButtonTitle:@"Cancel"destructiveButtonTitle:nil otherButtonTitles: @"Image1", @"Image2", @"Image3", @"Image4", @"Image5", @"Image6", @"Image7", @"Image8",@"Image9", @"Image10", @"Image11", @"Image12", @"Image13", @"Image14", @"Image15", nil];

self.actionSheet.tag = 1;
for (id button in [self.actionSheet valueForKey:@"_buttons"])
 {
     UIImageView* buttonImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:[button titleForState:UIControlStateNormal]]];
     [buttonImage setFrame:CGRectMake(5, 5,35,35)];
     [button addSubview:buttonImage];
 }

 [self.actionSheet showInView:[UIApplication sharedApplication].keyWindow];