iOS TabBarItem small space on each side - ios

So this is the problem I am talking about.
As you can see, there is a small space in front of Tab1 selection image on the top. I cannot figure out how to delete that space. Currently, items don't have selected image and image assigned, because I don't need one. All I need is text in tabs. So for selection image, I am using TabBar selection property. I added some code, to stretch the selection image, otherwise it is appearing over neighbour tabs.
[UITabBar appearance].selectionIndicatorImage = [[UIImage imageNamed:#"selected.png"]
stretchableImageWithLeftCapWidth:0 topCapHeight:0];
Is there any way to remove that space?
Thank you in advance!

Set imageInset point set in your tabbar item and check i think working good
self.tabBarItem.imageInsets = UIEdgeInsetsMake(0//topOffset, 0//left, -0//bottomOffset, 0//right);
But keep in mind that whatever the value of edgeinset you give, give the opposite value to its opposite side,meaning if you give top 6, then give bottom -6 Or else the image will keep on growing or shrinking after each click.
Hope this will help you great and You're feeling better for your code is working good.

Related

Increasing size of image in UIButton

Currently, I have a UIButton and want to set an image inside of it. I'm successfully able to set the image to inside the UIButton but for some reason, the image is VERY small compared to the UIButton. I want to increase the size of the image - no, not cover the entire button just a slight increase so it's a bit more visible on the UI.
More information, my UIButton is 40x40. The answers I've seen on StackOverFlow have indicated changing the Content Mode but even those answers have not helped. I'm a little stuck at this point so any expertise/advice would be highly appreciated!
Figured it out. I had to use image insets. This property allows to reposition the drawing rectangle for the button image. By setting values to the top, bottom, left, and right image insets we're creating a rectangle and thus, increasing the space for our image to be draw in.
I had actually seen this suggestion in other answers and had tried it but on IB, nothing seemed to change but I finally decided to test it on simulator and saw the affects.

UIButton with image on right side of text, with fixed trailing space to button edge

To get right to the case, I need a checkmark on the right side of my text on my UIButtons, and the checkmark has to be in a fixed length from the buttons right edge. To illustrate, i've added two images, of how it's supposed to work:
As you can see, the checkmarks aligns perfectly - so I was happy! But when I run my app on iphone6S PLUS, or on iPad, the checkmarks gets all messy..
Here's another image to illistrate - this is on iPhone 6S PLUS - its even worse on iPad.
I wasn't able to align the checkmarks in Interface Builder (AutoLayout), so I've done all the image-adding in code.
Here's my code, for applying a checkmark to a button:
let btnImage = UIImage(named: "checkmarkWhite")
categoryButtonOne.setImage(btnImage, forState: UIControlState.Selected)
categoryButtonOne.semanticContentAttribute = .ForceRightToLeft
categoryButtonOne.imageEdgeInsets = UIEdgeInsetsMake(0, (categoryButtonOne.frame.width / 2) - (btnImage?.size.width)! - 10, 0, 0)
My intension was, to get the length of the button (as it differs according to the screensize from device to device), and then place the image in the same spot, on all the buttons.. But as you see, I didn't really succeed.
Does anyone of you, have an idea about, why the checkmarks are not getting placed equally? I'm using the exact same line of code to place the image, for all the buttons.
Has it something to do with the text on the button? If so, would it be possible to make the button ignore the text, and just place the image properly?
A simple and easy solution:
Use customised View with Label, Image & Actionable elements that can handle user touch/tap actions (UIButton or Tap Gesture). It would be very easy to handle your requirement.
According to your design, you've shared here, use UICollectionView with custom cell. It's easier than customised view.
Else, you can try this solution:
Align button image to right edge of UIButton

move a UIView according to the progressView's Progress

well am trying to make this UI :
the above UI contains a ProgressView on UITableViewCell and the vertical line is a UIView (if i should use something else then a UIView for this vertical line then please do provide your suggestions ) well am stuck in moving this vertical line ? how can i place this line at the point where the bar is filled as shown in the image , if anybody knows then please let me it'll be so helpful for me
the pseudocode for what i need will be like
verticleLine.xAxisPostion = progressBar.progress.xAxis
Trying to think out of the box here: maybe you could use a UISlider instead with userInteractionEnabled set to false? With UISlider you can specify not only the track color, but also the thumb image (being a tiny plain grey vertical bar in your case).
To expand a little bit: you set the minimumTrackTintColor to green, the maximumTrackTintColor to red (or stretchable images for minimum/maximumTrackImage), minimumValue to 0, maximumValue to 1. Instead of progress you can now use value — and it should give you roughly the same behaviour with the thumb (grey bar) following the value.
the above UI contains a ProgressView
Don't use a UIProgressView. Just create your own self-drawing view that looks exactly the way you want it to. The view that you've designed — green to the left of the progress point, red to the right of the progress point, and a vertical line right at the progress point — is trivial to draw, and trivial to redraw when progress happens (i.e. when the value changes).

How to get rid of space before and after first and last items in UITabBar?

I have standard UITabBarController with 5 items. Everything is fine except that UITabBar does not draw selected item indicator image of first or last item from/to the edge, but keeps small space before/after it as shown in picture. I can't get rid of it and it drives me nuts. Any help is appreciated, thanks.
You should look into
UIEdgeInset property into tabbar. Play with it a bit and you will get the hang of it.
Here's an example--
self.tabBarItem.imageInsets = UIEdgeInsetsMake(6//topOffset, 0//left, -6//bottomOffset, 0//right);
But keep in mind that whatever the value of edgeinset you give, give the opposite value to its opposite side,meaning if you give top 6, then give bottom -6
Or else the image will keep on growing or shrinking after each click.
Hope this helps

iOS app folders

I'm looking for an idea in order to reproduce the look of the iOS app folders (menu on iPhone/iPad).
I'm wondering how is it possible to separate the background image in order to make appear the content of the folder.
Does someone already do this ? Or have an idea on how we can do ?
EDIT : I'm trying to reproduce this effect.
http://img4.hostingpics.net/pics/873912photo.png
I actually looked at this a while back.
This is how i approached the problem:
You have a background view (the image) and a layer on top (the icons).
Calculate the split line.
Split the view and layer into tow along the split line
Add the content of the folder under the image.
Add you folder icon on top of everything.
Animate the bottom part down while changing opacity of the layer icon.( so you can see the content underneath)
While animating you should probably mask the triangle under the icon to it gives that bubble effect.
To close, just reverse the animation.
I didn't manage to make it work 100% but i can tell you it works (at least some parts of it).
And before you ask, no, i cannot give you the code because i didn't keep it.
Try make screenshot like this:
UIGraphicsBeginImageContext(CGSizeMake(screenWidth, screenHeight));
[self.view.layer renderInContext: UIGraphicsGetCurrentContext()];
UIImageView* imageView = [[UIImageView alloc] initWithImage: UIGraphicsGetImageFromCurrentImageContext()];
UIGraphicsEndImageContext();
[self.view addSubview: imageView];
You can make two screenshots and add with different frames as subviews.
I hope it helps you.

Resources