I've not much response so am adding some more info.
My buttons are not rectangular, nor organised in a grid so I need a way of creating what looks like a button (and shows that it has been pressed visually, as per a standard UIButton) but where the touchable area is different to the image area.
I am using a transparent PNG and that element works fine. I've added the buttons in Interface Builder and am wondering if that is the problem.
However, if I change imageEdgeInsets, it distorts the image display, which is obviously not what I want.
Bizarrely, if I increase the dimemsions of the button, it doesn't change the image, but if I decrease them it does.
I have tried different combinations of mode (scale to fill etc), but to no avail.
I am aware that there is an image and background image property, but in IB there is only one.
Essentially, I don't understand how the geometry works and the Apple documentation doesn't seem to help.
Surely, I can't be the only person to try to do this. Any help would be warmly welcomed.
Many thanks,
Chris.
Try setting the buttons setting to Aspect Fit. This will fill the button with your image so a smaller image than the button size would leave the space around the image.
Also set the button type to custom.
In the end, I stumbled across Ole Begemann's Non-rectangular buttons class. It just does what I need - to be able to create buttons where the touchable area follows the visible element of a non rectangular image.
#Helium3 - thanks - that allowed me to use a larger touch area, bit not a smaller one.
Related
I'm trying to build a custom, reusable UIScrollView that can be added to multiple views. The scroll view is going to be a weight picker. For the life of me, I can't find a decent example for how to implement this neatly or cleanly.
I would love for someone to point me to an existing library or tutorial that shows me how to do this. I've hacked apart a few examples, but so far, nothing is very good or reusable. Please help!!
For what it's worth, I have an image that individual ticks for the weight. So I can select to the tenth of the number (e.g. 160.4). The image has the first tick bold and larger than the remaining 9. I'd like to have the weight/number centered over the large tick. I'll update the points to my label/datasource after scrolling stops.
UPDATE
I need to make this. I have the custom font, background, and ticker image.
I would not do this through an UIScrollView. I think it would be more complex and you would certainly end up having issues when trying to add you custom picker into another scroll view.
What I would do is:
building the picker view by means of a series of CALayers, each one representing a "building block" of your picker view; see attached image:
each building block would represent a specific value by mixing a UILabel (the text) and an image;
use a pan gesture recognizer, or alternatively define touchesBegin/Moved/Ended method to deal with panning;
when a pan is done, you displace the view content to the left or right according to the panning;
when panning, you also add new building blocks to the left or right end of the picker to account for empty areas that would be revealed by the displacement done at point 4.
I think that having a look at another kind of custom control source code would be of great help to you. You would not possibly find your custom picker already implemented, but could get some guidance. Have a look then at cocoa controls.
Hope this helps.
If I were going to implement this, I would create a really wide image that had every weight on it I'd ever need - I would probably create this in code when the app started up. This image is then used as the contentView of your picker. You get all the scrolling features "for free", and you could even update the values shown in the other parts of the view during scrolling (or dragging.
The scrollView is just the area with the tick marks and weight numbers, and resides in a subview above the background, but below the centered vertical line that shows the actual weight.
EDIT: on second thought, forget the image. If you have the code to draw the image, you can do the drawing in a custom UIView. So you get the draw rect, you know the contentOffset, so you can draw just what you need.
I am developing an application in which I need to round button as image (as I uploaded).
It Show two corner are straight and the rest is in round shape. I tried withmybutton.layer.cornerRadius but make round whole image. I also tried to just make custom button but it leave extra space in button around image i need to fix size button as image show.
Please help me. Thanks in advance. Happy Day.
Here is a one good tutorial on this:
http://iphonedevelopment.blogspot.in/2010/03/irregularly-shaped-uibuttons.html
you can download code from here
https://github.com/ole/OBShapedButton
Hope this helps
An alternate but not really a good one first add an imageView add this particular image over it than add an custom invisible button over the image by adjusting size of the button it will not cover the whole image though but still it will work fine...actually i did use this approach in one of my app :p
OBShapedButton might help. It's an open source UIButton subclass optimized for non-rectangular button shapes. If it still doesn't work, making your own buttons isn't that difficult either. Use a UIView and handle touches within the view. For eg, in touchesMoved:, set the active image and in touchesEnded:, handle the click event!
As you can probably tell from my last few questions, I am working on a screen that allows users to edit labels. Pages and all the other lovely apps have glorious resizing handles to show what label is currently being edited.
I am trying to get some feedback on the best way to do this. Is it possible to add an 'dot' image to the centre of all the edges of the label? Is it possible to change the background colour only in sections of a label?
Or should I add an image on top of the label and disable it? The most important feature is for only the uilabel to respond to touches. If I overlay an image, I want it to ignore the touch and hand it off to the label.
Any feedback appreciated!
Cheers Guys!
You will find as many opinions on this as there are programmers. There is not built-in decoration for a view that shows the dot in the middle of each side. But you can add that easily enough. One way is instantiate four instances of an image with the dot and add them as subviews of the view you are decorating. you can then set the center of each dot on the center of each edge in the parent view. As long as clipping is turned off in the parent view, these will show up (if they are not hidden) even if they extend outside the frame of the parent view.
I don't understand what you want to accomplish by changing the background color in sections of the label view, but I this probably has some moderate complexity to it.
You can also to this with core graphics. I'll stop there, though. There are literally many ways to do what you are trying to do.
I am brand new to iPhone app development. I am trying to create an image reader using UIScrollView. I need to focus a portion of an image and hide the rest. Till now I am only able to focus required part of an image but have no clue how to hide the rest. I had a suggestion that, I need to add four views at top, bottom, left and right. I need to hide those as per requirement. But, I was able to go no where with the suggestion. Can you please tell me how can I implement the functionality?
I don't understand what you really want to do. But if you think putting for views above I might suggest you use mask image for the same. Use alpha component.
Atlast I was successful in hiding part of an image. I used four views with background color and resized them according to the portion I need to display.
I have numerous photos in portrait and landscape format. I want to be able to display a "crop" of the photo in a UIImageView on the iphone. If the picture is in landscape format I want it to resize to fit the frame, if it is in portrait format I need it to resize to fit the width, and then be cropped at the top and bottom. As if there is a "window" over the image - so it looks like a landscape picture.
It would be even better if this could be a UIButton - although I am aware that I can use touchesBegan and such on images to make it behave like a button if needs be.
Thanks for any help you can give me.
Thanks
Tom
In an ImageView, you can change the View Mode to Aspect Fill. It will give you the right scaling/cropping you want.
For interactions, you can use a Custom button with no drawing at all (no Title, no Image, no Background) with the same size as your ImageView. That would be safe with regards to the image aspect. I've tried similar stuff using the button's Background or Image properties, it can have some undesired effects (I've ran into a resizing issue on iOS 3.1.3 for instance).
1°) To Crop the Image, try to add a method to UIImage class to do it (you can google it without problem, or even on StackOverFlow)
2°) To add a "window" over your image, just add an UIImageView over your image wich has transparency. It should work ;-)
3°) To know when an image is touched, you can use "touchesBegan" to detect which image were selected. But I think it's the last of your problems ^^
What you cant to achieve isn't so hard, just to it step by step !
If you want more help in one step, say it. But I can't code it all for you ;-)
Good Luck