Discussion Forums  >  Uncategorized

Replies: 4    Views: 224

basement
Aspiring developer
Profile
Posts: 488
Reg: Apr 07, 2011
Ontario
4,880
01/02/12 11:23 AM (14 years ago)

positioning of icon menus (iOS)

hi, I need to get this fixed ASAP as the client wants me to upload the revised app this week if possible........... I have an icon menu above a tabbed menu, and I need the icon menu to be equally spaced left and right on the screen. I think the only way to do this is to make the icons rectangular, but something in the BT code forces them to be square. Please see this for a screen grab and you'll see what I mean... this shows the menu icons equally spaced and everything looks great, except the bottom row of icons is cut short by the tabbed menu: http://b143files.com/argh.jpg this shows the menu icons fitting nicely in the height, but because they're forced to be square, there's too much space on the right: http://b143files.com/argh2.jpg Rather than just equalizing the spacing on the widths of the second example, I'd prefer to make the buttons rectangular. How can I do this? (my client wants the bottom tabbed menu to remain, so losing it - even though it would fix the problem - is not a possibility thanks!
 
Paddy
Lost but trying
Profile
Posts: 240
Reg: Oct 08, 2011
Hands Up !
12,500
like
01/02/12 11:31 AM (14 years ago)
I'd love to know this too.
 
David @ buzztouch
buzztouch Evangelist
Profile
Posts: 6866
Reg: Jan 01, 2010
Monterey, CA
78,840
like
01/02/12 02:55 PM (14 years ago)
It's tough to explain how this works and best if you dig through the BT_screen_menuButtons.m file to try to get your head around the design. Several things are happening when laying out the screen. 1) All the buttons are included in a UIScrollView. The UIScrollView is full screen (against the left and right edge of the device). 2) Buttons are many different 'parts' inside a 'box' Each 'box' is added to the scroller then inside each box an image, a background, and a label are added. You'll see in the source code (BT_screen_menuButtons.m) where the width of each button and the button padding (margin) are determined when doing the layout. Again, kinda complicated. The example screenshots make perfect sense and it may make more sense to make the buttons rectangles instead of squares. This may or may not be easy, depending on your skill. I would do it this way.. a) All the button parts in included in a frame called 'button box', one for each button, all will be the same size square. Have a look at line 481, this is where this box is setup: UIView *buttonBox = [[UIView alloc] initWithFrame:CGRectMake(left, top, boxWidth, boxHeight)]; b) Add a background color to this box while you tinker so you can see it on the screen when while you workout your adjustments. [buttonBox setBackgroundColor:[UIColor redColor]]; (syntax may be off). At this point, your buttons will have a red background so you can see where they are positioned (remove this background color when you're done). c) Have a look at the statement above where the box is setup. The boxWidth value is the button size you set in the control panel. Hard-code this in this file to make the buttons wider but not taller (rectangle). Change the boxWidth value on line 352 to whatever you want (ignore the control panel setting). Like... int boxWidth = 200; Experiment with the width height... d) After you get the buttonBox the right size, you may also need to adjust the frames for all the parts inside this box. Each part has it's own frame (the UILabel, the image view for the graphic, etc). e) May get trickier to understand? When the BT_screen_menuButtons.m file creates all the 'boxes' to put the parts in, it adds a BT_button_view.m to the box. This is what holds the image / icon. This means that this file (BT_button_view.m in the /BT_Objects folder) may also need to be tweaked after you change some sizes. It's expecting to make a square box for the button images and it uses the same size you set in the control panel. This means you may or may not need to tweak the sizes in that file too.
 
Paddy
Lost but trying
Profile
Posts: 240
Reg: Oct 08, 2011
Hands Up !
12,500
like
01/03/12 09:46 AM (14 years ago)
Great info David, thanks for taking the time to answer. That should get me in the right direction. If all goes well, I may try a new plugin for this. Cheers,
 
basement
Aspiring developer
Profile
Posts: 488
Reg: Apr 07, 2011
Ontario
4,880
like
01/03/12 09:51 AM (14 years ago)
thanks for the quick response, I spent a while on this but still can't get the buttons to be rectangular. I resized the original button pngs to the size I want, and set the sizes in BT_screen_menuButtons.m : http://b143files.com/grab.jpg but they're still resized to square.
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.