Learn Universal Windows Programming Via Modern C++ (RadioButton)

RadioButton is used to allow to the user select single items, whereas checkbox allows users to multiselect.

Before reading this article, I highly recommend reading the previous part of the series.

RadioButton

RadioButton is used to allow to the user select single items, whereas checkbox allows users to multiselect. Each RadioButton contains the GroupName property. if we set the same groupname, all the radio buttons belong to one groupname, and based on different names, we can create one or more groups of the Radiobuttons.

Note

RadioButton should be under any one of the groupnames. If groupname is not specified radioButton is allowed to multiselect.

RadioButton has two states: selected and cleared. In the group one radio button has selected the other radio button's state to automatically clear, IsChecked property is used to find if the item has selected or not. If the item has selected, IsChecked property is true, otherwise it's false. 

Tag Property

Tag Property is used to store the custom value into the control. Instead of IsChecked property, we can use the Tag property to process the operation fast.

Let's see one example of how to use RadioButton and Tag Property. Based on radiobutton selection, Windows background color should be changed. 

  1. #include "pch.h"  
  2.   
  3. using namespace winrt;  
  4. using namespace Windows::ApplicationModel;  
  5. using namespace Windows::ApplicationModel::Activation;  
  6. using namespace Windows::Foundation;  
  7. using namespace Windows::UI;  
  8. using namespace Windows::UI::Xaml;  
  9. using namespace Windows::UI::Xaml::Controls;  
  10. using namespace Windows::UI::Xaml::Controls::Primitives;  
  11. using namespace Windows::UI::Xaml::Interop;  
  12. using namespace Windows::UI::Xaml::Media;  
  13. using namespace Windows::UI::Xaml::Navigation;  
  14. using namespace Windows::UI::Popups;  
  15. using namespace Windows::Storage;  
  16. struct App :ApplicationT<App>  
  17. {  
  18.   
  19. public:  
  20.     virtual ~App() = default;  
  21.     StackPanel sPanel;  
  22.       
  23.     IInspectable MakeString(hstring captionText)  
  24.     {  
  25.         return PropertyValue::CreateString(captionText);  
  26.     }  
  27.   
  28.     IInspectable MakeTag(int Idx)  
  29.     {  
  30.         return PropertyValue::CreateInt32(Idx);  
  31.     }  
  32.   
  33.     RadioButton CreateRadioBtn(hstring groupName, hstring contentName,int TagIdx)  
  34.     {  
  35.         RadioButton RButton;  
  36.         RButton.GroupName(groupName);  
  37.         RButton.Content(MakeString(contentName));  
  38.         RButton.Checked({this,&App::RdButtonClick});  
  39.         RButton.Tag(MakeTag(TagIdx));  
  40.   
  41.         return RButton;  
  42.     }  
  43.   
  44.     hstring GetRbButtonName(IInspectable const& sender)  
  45.     {  
  46.         RadioButton chkBox = sender.as<RadioButton>();  
  47.         IPropertyValue IValue = chkBox.Content().as<IPropertyValue>();  
  48.         return IValue.GetString();  
  49.     }  
  50.   
  51.     int GetTagIndex(IInspectable const& sender)  
  52.     {  
  53.         RadioButton chkBox = sender.as<RadioButton>();  
  54.         IPropertyValue IValue = chkBox.Tag().as<IPropertyValue>();  
  55.         return IValue.GetInt32();  
  56.     }  
  57.   
  58.     void RdButtonClick(IInspectable const & sender, const RoutedEventArgs &args)  
  59.     {  
  60.         auto Idx = GetTagIndex(sender);  
  61.         auto chkName = GetRbButtonName(sender);  
  62.   
  63.         switch(Idx)  
  64.         {  
  65.         case 1:  
  66.             sPanel.Background(SolidColorBrush(Colors::Red()));  
  67.             break;  
  68.         case 2:  
  69.             sPanel.Background(SolidColorBrush(Colors::Green()));  
  70.             break;  
  71.         case 3:  
  72.             sPanel.Background(SolidColorBrush(Colors::Blue()));  
  73.             break;  
  74.         }             
  75.     }  
  76.   
  77.     void OnLaunched(LaunchActivatedEventArgs const&)  
  78.     {  
  79.   
  80.         auto RdBtnRed = CreateRadioBtn(L"Color", L"Red",1);  
  81.         auto RdBtnGreen = CreateRadioBtn(L"Color", L"Green",2);  
  82.         auto RdBtnBlue = CreateRadioBtn(L"Color", L"Blue",3);  
  83.   
  84.         Thickness margin;  
  85.         margin.Bottom = 10;  
  86.         margin.Left = 10;  
  87.         margin.Right = 10;  
  88.         margin.Top = 10;  
  89.   
  90.         
  91.         sPanel.Margin(margin);  
  92.         sPanel.Children().Append(RdBtnRed);  
  93.         sPanel.Children().Append(RdBtnGreen);  
  94.         sPanel.Children().Append(RdBtnBlue);  
  95.   
  96.         auto window = Window::Current();  
  97.         window.Content(sPanel);  
  98.   
  99.         window.Activate();  
  100.     }  
  101. };  
  102.   
  103.   
  104. int __stdcall wWinMain(HINSTANCEHINSTANCEPWSTRint)  
  105. {  
  106.     Application::Start([](auto &&) {make<App>(); });  
  107.     return 0;  
  108. }  
Output 
 
 
 
Tag is an IInspectable interface, so we have to use the PropertyValue to convert the int to IInspectable 
  1. IInspectable MakeTag(int Idx)  
  2.     {  
  3.         return PropertyValue::CreateInt32(Idx);  
  4.     }  
and as operator is use to convert the IInspectable to PropertyValue value:
  1. int GetTagIndex(IInspectable const& sender)  
  2.     {  
  3.         RadioButton chkBox = sender.as<RadioButton>();  
  4.         IPropertyValue IValue = chkBox.Tag().as<IPropertyValue>();  
  5.         return IValue.GetInt32();  
  6.     }   
  7.       

Conclusion

I hope you understood how to use the Radiobutton control.