How to create a UIBarButtonItem with UIImageView and UILabel

enter image description here

As shown above, I want to create a UIBarButtonItem with UIImageView and UILabel in the toolbar. I tried

UIButton *likecommButton = [UIButton buttonWithType:UIButtonTypeCustom];
    likecommButton.backgroundColor = [UIColor clearColor];
    [likecommButton addTarget:self action:@selector(likecommButtonClicked:) forControlEvents:UIControlEventTouchDown];


    UIImageView *likeImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"like.png"]];
    likeImageView.frame = CGRectMake(0.0, 0.0, LikeCommentImageEdge, LikeCommentImageEdge);
    likeImageView.backgroundColor = [UIColor clearColor];
    [likecommButton addSubview:likeImageView];
    [likeImageView release];

    CGSize numberSize = [@"99" sizeWithFont:[UIFont fontWithName:@"Verdana-Bold" size:12] 
                                     constrainedToSize:CGSizeMake(20.0, 20.0)  
                                         lineBreakMode:UILineBreakModeTailTruncation];

    _likeNumberLabel = [[UILabel alloc] initWithFrame: CGRectMake(likeImageView.frame.size.width, 0.0, numberSize.width, numberSize.width)];
    _likeNumberLabel.backgroundColor = [UIColor clearColor];
    _likeNumberLabel.textColor = [UIColor whiteColor];
    _likeNumberLabel.font = [UIFont fontWithName:@"Verdana-Bold" size:12];
    _likeNumberLabel.textAlignment = UITextAlignmentRight;
    _likeNumberLabel.lineBreakMode = UILineBreakModeClip;
    [likecommButton addSubview:_likeNumberLabel];

    UIImageView *commentImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"comment.png"]];
    commentImageView.frame = CGRectMake(_likeNumberLabel.frame.origin.x + _likeNumberLabel.frame.size.width, 0.0, LikeCommentImageEdge, LikeCommentImageEdge);
    commentImageView.backgroundColor = [UIColor clearColor];
    [likecommButton addSubview:commentImageView];
    [commentImageView release];

    _commentNumberLabel = [[UILabel alloc] initWithFrame: CGRectMake(toolBarButtonWidth - numberSize.width, 0.0, numberSize.width, numberSize.width)];
    _commentNumberLabel.backgroundColor = [UIColor clearColor];
    _commentNumberLabel.textColor = [UIColor whiteColor];
    _commentNumberLabel.font = [UIFont fontWithName:@"Verdana-Bold" size:12];
    _commentNumberLabel.textAlignment = UITextAlignmentRight;
    _commentNumberLabel.lineBreakMode = UILineBreakModeClip;
    [likecommButton addSubview:_commentNumberLabel];

    likecommButton.frame = CGRectMake(0.0, 0.0, toolBarButtonWidth, numberSize.height);

    _likeCommCountButton = [[UIBarButtonItem alloc] initWithCustomView:likecommButton];
    _likeCommCountButton.width = toolBarButtonWidth;
    _likeCommCountButton.enabled = NO;

but can only get this

enter image description here

How to create UIBarButtonItem, as shown in the first image, include UIImageView and UILabel also have UIBarButtonItemStyleBordered style?

thank


Update 20120506

This is @RA's next idea - a small toolbar

enter image description here

The problem of this I know how to set the frame on the toolbar, but I can not get the other two UIBarButtonItems "Like" and "Comment" height. then I can’t set the minimum height of the toolbar.

Then I tried to add all the controllers, two images and two tags to the UISegmentControl

enter image description here

, uibarbuttonitem (UISegmentControl) .

segmentControl.tintColor = [UIColor clearColor]; 
    segmentControl.backgroundColor = [UIColor clearColor]; 

.

@R.A , UIBarButtonItem .


20120509

, , UISegmentControl ( ). . . , @R.A @vishiphone, , , . , , . . , , , ! !

+3
5

/ UIButton - customView UIBarButtonItem

( )

  • BarButtonPressed;
  • BarButtonPressed @2x
  • BarButtonNormal
  • BarButtonNormal @2x

BarbuttonpressedBarButtonPressed @ 2xBarbutton normalBarButtonNormal @ 2x

+2

, .

UIToolBar UIBarButtonItem's toolbar 1 respectively.

, UIToolBar () customView BarButtonItem with Bordered style.

trick UIToolBar, not having any border style (UIBarButtonStyleNone β†’ Like this, ).

, , 2 . - . .

+1

enter image description here . , .

UIView *BtnView = [[UIView alloc] initWithFrame:CGRectMake(0,0,70,35)];
UIButton *myButton = [[UIButton buttonWithType:UIButtonTypeCustom] retain];
[myButton setFrame:CGRectMake(0,3,70,32)];
[myButton setImage:[UIImage imageNamed:@"firstImage.png"] forState:UIControlStateNormal];
[myButton addTarget:self action:@selector(compete) forControlEvents:UIControlEventTouchUpInside];



UIImageView *imageView=[[UIImageView alloc]initWithFrame:CGRectMake(52, -4, 21, 21)];
[imageView setImage:[UIImage imageNamed:@"Secongimage.png"]];
UILabel *badge_Label=[[UILabel alloc]initWithFrame:CGRectMake(5,3, 15, 15)];
badge_Label.backgroundColor=[UIColor clearColor];
badge_Label.font=[UIFont systemFontOfSize:12];
[badge_Label setText:@"20"];
[imageView addSubview:badge_Label];


[BtnView addSubview:myButton];
[BtnView addSubview:imageView];
[myButton release];

UIBarButtonItem *CompeteButton = [[UIBarButtonItem alloc]initWithCustomView:BtnView]; 

self.navigationItem.rightBarButtonItem = CompeteButton;


UIView *leftBtnView = [[UIView alloc] initWithFrame:CGRectMake(0,0,40,40)];
UIButton *menu_Button = [[UIButton buttonWithType:UIButtonTypeCustom] retain];
[menu_Button setFrame:CGRectMake(0,3,37,37)];
[menu_Button setImage:[UIImage imageNamed:@"menubut.png"] forState:UIControlStateNormal];
[menu_Button addTarget:self action:@selector(list) forControlEvents:UIControlEventTouchUpInside];

[leftBtnView addSubview:menu_Button];

UIBarButtonItem *menuButton = [[UIBarButtonItem alloc]initWithCustomView:leftBtnView]; 
self.navigationItem.leftBarButtonItem = menuButton;
+1

I think you skipped the settings frame for each subview. Try adding with Frames, then you get what you want.

0
source

You have to create UIViewone that will be a wrapper for UILabeland UiImageView, add them as sub-items of this UIView, and then use as above:

_likeCommCountButton = [[UIBarButtonItem alloc] initWithCustomView:_wrapper_view_];

And don't forget to set subviews frames correctly.

0
source

All Articles