I currently face a problem when using UIButton. I have the background image designed by others like this:
background image
and I need to place the title for the button right after the white vertical bar in the background image. I tried to set left edge for the content but since I used auto layout, the frame will be different with different screen size(3.5", 4.7"...).
Is there a way to put text in the position related to background I want with auto layout.
Thanks
I personally would split the left side of the background image from the right side. This way you can have two UIButtons next to each other with horizontal space constraint of 0. The right side of the button will have to be placed inside a UIImageView so you can set the image as a property of the view rather that the button's background. You don't have to do this of course, but I prefer this solution as it is easier to manage across different screen sizes.
Here is a visual representation of what I explained above:
Separated Views for Single UIButton
You will then need to route the touch events of both buttons to run the same method or function, just so that both the right side and the left are clickable.
Note: I'm not sure exactly what you had in mind for the highlighting of the button, but this will have to be tested and adapted to get the desired effect.
Related
I am trying to make a square button that is on the smaller side (30x30), and I want to include the amount of participants there are as the text, for some reason the button is cutting the title off on the left and ride sides (see picture) forcing me to either have a bigger button (not ideal) or have really small text (also not ideal). Is there a way to stop it from cutting off?
If you're trying to display one character in that 30*30 button, make the button size large, check screenshots for reference:
Change Button Style Plain into Default.
I am trying to match my graphic designer's interface design to be exact in every IOS device. My problem is the images on the buttons are never the right ratio and I am having trouble making sure the buttons autosize correctly.
This is a picture of the artist's intent
This is my implementation of the buttons using different views
How do I resolve these autosizing issues to correctly solve this problem? I have watched plenty of tutorials on resizing images, but I haven't seen any that cover images that aren't symmetrical.
If you simply wish to resize those "buttons" (which I assume are actually UIImageViews) depending upon the device, create a relational constraint between the button image and the parent views (in your case, I suppose these should be the black and white UIViews). You can accomplish this by tapping both of the views at the same time and then "Create width/ height constraint".
Then, select the constraint and tap the "Show Utilities Area" (the most top right corner button). You'll have there in the Attributes a Multiplication property. The default is 1. Keep in mind that if the first element of the relational constraint is the parent view, then the multiplication factor has to be lower than 1 and viceversa.
EG: I suppose your button should always have a 1/6 part of the screen. Then, you should write in the Multiplication property of your constraint either 1/6 or 0.17.
Wondering if the above can be created using UISlider? If not, what other ways can this be accomplished?
You can set components of a UISlider, such as the currentThumbImage ( see: "Appearance of Sliders"1).
However, it is almost certainly easier to just re-implement a slider for this much customization. Simply use background UIImageView with the scale image, and then add a separate UIView (or UIImageView) for the arrow. Finally, attach a UIPanGestureRecognizer to the arrow view to allow a user translate the view vertically.
You can change a lot in the appearance of a UISlider like setting the thumb to a red arrow. You can also replace the background image with the inches ruler and with different rulers for the different device types and display sizes.
The one thing that I don't see is that you turn the slider to work vertically. I know them only working left to right.
If I'm right, your only chance is to have a ruler as background image and a view that contains the arrow and a label with the actual value. That whole view can be pawned and tapped using Gesture Listener.
On the storyboard I have two UIButtons. In my UIViewController subclass I have one IBAction method for this buttons. One of this buttons has an image and hasn't got a title, another has the title but hasn't got the image. So, it's simply image that behaves as a button and ordinary button.
Both of this buttons call a method. The problem is that if I push one button, another doesn't highlight. Another problem that this buttons have padding and for me will be better if this padding will be touchable (I mean space between image button and title button to be clickable).
I know that I can subclass UIButton and make my buttons as I want, but maybe there is a way to make what I want without subclassing?
Thanks.
1)
Assign both buttons to properties.
When an IBAction fires, you can set one or both buttons to highlighted via those controls' "highlighted" properties, or via setHighlighted:.
2)
As for making space between the buttons touchable, set the alignment for the button graphic to left aligned or right aligned (the latter is what I've done in my example below) and these two separate buttons have edges that are touching.
3) Or...
You can cheat and have simply one button and put some space between your image and your button text, like this:
Yes, that's a whole bunch of spaces (which I've highlighted in green) before the word "Button".
Subclassing is a good thing. If you need a button with both an image and a title, then by all means create a subclass of UIButton that does what you want. You do that once, and then use it anywhere that you want. The alternative is to muck around with stacked duplicate buttons everywhere you want this look.
I found the most suitable variant for me and I think for all, who encountered the same problem. If you have one UIButton for image and another UIButton for text(title label), you can combine this two UIButtons to one Custom type UIButton. Then you can set image and title label text to this custom button. After that, use Insets to layout your image and title label.
For example, to set title label under image you must set Inset Left parameter as negative value and Inset Left parameter as positive value that is greater than image height. With Insets you can set proper image size too.
Using this way you don't need to handle highlight property changing by yourself.
I created a custom UIbutton and placed it onto a view which shows certain information about a package.I want the whole area to be touchable as button that was my starting point.THe problem is that only the upper half of the custom button is touchable and the down part is ignored.I set the background color to a solid one and the frame seems to be ok.
UPDATE: If i add the same custom button to superview it seems to be ok but the coordinates are not right in this case.I need to convert the coordinates of the subview to super view.
After struggling so many hours i figured out that my outer frame was smaller than it was supposed to be.