Thursday, April 14, 2011

Round UIButton

Hi,

I want to know whether drawing a round UIButton(not rounded rect) is possible.

When I add a round image in a UIButton of type custom, then it looks like a round button. But at the moment the button is clicked the boundary of the button becomes visible, so that it looks like a square button, then again when the click ends it looks like a round button.
I want the button to look like a round button even at the moment the click happens. is this possible?

From stackoverflow
  • You'd probably have to create a custom control for that, but do you really need a round button?

    Every platform has its UI conventions, and the iPhone is no exception. Users expect the buttons to be rounded rectangles.

    UPDATE in response to comment:

    If I'm getting this right, you're not looking for a round button, but rather a clickable (touchable) image.

    You can use an UIImageView and its touchesBegan method.

    UPDATE 2:

    Wait a second. What kind of radio button are we talking about? For some reason I thought you were trying to imitate a real radio. If you're talking about a radio button group, please use a UISegmentedControl or a UIPicker.

    saikamesh : actually i need to add a radio button. for that I have a radio button image which is of round in shape. thats why I wanted to draw a round button
    saikamesh : yes, I will try this method. I thought adding a image in a button would be easier.
  • From what I know of the SDK (admittedly I have very little experience beyond tutorials in books/screencasts), you'd have to create your own control to have a radio button. There are a couple of suggestions on how to implement that in this question.

    That said, from a user's perspective I feel like it would be better to stick to the native controls. iPhone users are used to specific controls (i.e. UITableViews or UIPickerViews) for this type of interaction. Straying from practically universal UI conventions tends to make the user experience more jarring.

  • Just create two rounded button images, one for the pressed state and one for unpressed.

    In IB, create a UIButton of type Custom. Go to the section where you set a background image, and set the dropdown with "All" to normal - now set the image to your unpressed image.

    Then change the dropdown to "Selected", and put in your pressed image.

    Now change the fill type to be aspect fit, and make the button sqare. Use as a normal UIButton anywhere. You can of course also easily do this all programaitcally with similar steps (setting images for UIControlStateNormal and UIControlStateSelected).

0 comments:

Post a Comment