Creating radio button group Xamarin.iOS

PriyanKaAgRawaLPriyanKaAgRawaL Member ✭✭
edited June 2018 in Xamarin.iOS

I am creating radio button group. Which is not available in-build in Xamarin.iOS. However I have created 2 radio buttons but both independent(not acting like radio button group) I need only 1 option to be selected at a time & need text associated selected radio button.
My code

public override void ViewDidLoad()
{
    base.ViewDidLoad();
    var rBtn = new MyRadioButton(new CGPoint(20, 70), "Generic");
    this.Add(rBtn);
    var rBtn2 = new MyRadioButton(new CGPoint(160, 70), "Subject");
    this.Add(rBtn2);
}

MyRadioButton used above

public class MyRadioButton : UIView
{
private CircleView circleView;
private UILabel lbTitle;

public bool State {
    get {
        return circleView.State;
    }
    set {
        circleView.State = value;
    }
}

public MyRadioButton (CGPoint pt,string title)
{
    this.Frame = new CGRect (pt, new CGSize (150, 30));
    circleView = new CircleView (new CGRect(0, 0, 30, 30));
    lbTitle = new UILabel (new CGRect (30, 0, 120, 30));
    lbTitle.Text = title;
    lbTitle.TextAlignment = UITextAlignment.Center;
    this.AddSubview (circleView);
    this.AddSubview (lbTitle);
    this.BackgroundColor = UIColor.FromRGBA(1,0,0,0.3f);
    UITapGestureRecognizer tapGR = new UITapGestureRecognizer (() => {
        State = !State;
    });
    this.AddGestureRecognizer (tapGR);
}
}

class CircleView : UIView
{
private bool state = false;
public bool State { 
    get {
        return state;
    }
    set {
        state = value;
        this.SetNeedsDisplay ();
    }
}

public CircleView (CGRect frame)
{
    this.BackgroundColor = UIColor.Clear;
    this.Frame = frame;
}

public override void Draw (CoreGraphics.CGRect rect)
{
    CGContext con = UIGraphics.GetCurrentContext ();

    float padding = 5;
    con.AddEllipseInRect (new CGRect (padding, padding, rect.Width - 2 * padding, rect.Height - 2 * padding));
    con.StrokePath ();

    if (state) {
        float insidePadding = 8;
        con.AddEllipseInRect (new CGRect (insidePadding, insidePadding, rect.Width - 2 * insidePadding, rect.Height - 2 * insidePadding));
        con.FillPath ();
    }
}
}

See output screenshot below where I am able to select both radio button. They are not behaving like group

Tagged:

Best Answer

Answers

  • ColeXColeX Member, Xamarin Team Xamurai

    Add the tag to specify them.

            var rBtn = new MyRadioButton(new CGPoint(20, 70), "Generic");
            rBtn.Tag = 100;
            this.Add(rBtn);
            var rBtn2 = new MyRadioButton(new CGPoint(160, 70), "Subject");
            rBtn2.Tag = 101;
    

    Change the status when click on them.

          UITapGestureRecognizer tapGR = new UITapGestureRecognizer(() => {
    
                if(this.State == false)
                {
                    if(this.Tag == 100)
                    {
                        MyRadioButton button = this.Superview.ViewWithTag(101) as MyRadioButton;
                        button.State = false;
                    }
                    else
                    {
                        MyRadioButton button = this.Superview.ViewWithTag(100) as MyRadioButton;
                        button.State = false;
                    }
                }
                this.State = true;
            });
    

Sign In or Register to comment.