Learn Universal Windows Programming Via Modern C++(Border Control)

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

• Learn Universal Windows Programming Via Modern C++
• Learn Universal Windows Programming Via Modern C++ (Button Control)
• Learn Universal Windows Programming Via Modern C++ (Stackpanel)
• Learn Universal Windows Programming Via Modern C++ (CheckBox)
• Learn Universal Windows Programming Via Modern C++ (RadioButton)
• Learn Universal Windows Programming Via Modern C++ (Combobox)

In this article, we are going to learn about Border control in Modern C++

Border

Border is a container control; this control is used to draw the border of another control.

Properties

BorderThickness: This property is used to set the thickness of the border,.BorderBrush is used to the set the color of the BorderThickness, and background property is used to change the background color of the border.

A border can contain only one child object,. This property is used the make the border of another control

Here is sample code that shows you how to use the Border control 

        Border border;
        border.Margin(CreateThickness(15, 15, 15, 15));
        border.BorderThickness(CreateThickness(1,1, 1, 1));
        border.BorderBrush(SolidColorBrush(Colors::Red()));
        border.Background(SolidColorBrush(Colors::Brown()));

        border.Child(panel1);

ex: stackpanel is added into the border control 

 

 

 

CornerRadius

CornerRadius property is used to the make the corners rounded. BottomLeft , BottomRight , TopLeft , TopRight properties are used to set the CornerRadius of the Border control.

 

Sample code 

CornerRadius cornerRadius;
        cornerRadius.BottomLeft = 20;
        cornerRadius.BottomRight = 20;
        cornerRadius.TopLeft = 15;
        cornerRadius.TopRight = 15;
        borderLeft.CornerRadius(cornerRadius);

 

 

The below sample explains how to add the stackpanel into the Border control.

#include "pch.h"

using namespace winrt;
using namespace Windows::ApplicationModel;
using namespace Windows::ApplicationModel::Activation;
using namespace Windows::Foundation;
using namespace Windows::UI;
using namespace Windows::UI::Xaml;
using namespace Windows::UI::Xaml::Controls;
using namespace Windows::UI::Xaml::Controls::Primitives;
using namespace Windows::UI::Xaml::Interop;
using namespace Windows::UI::Xaml::Media;
using namespace Windows::UI::Xaml::Navigation;
using namespace Windows::UI::Popups;
using namespace Windows::Storage;

struct App :ApplicationT<App>
{
public:
    virtual ~App() = default;
    StackPanel sPanel;

    IInspectable MakeString(hstring captionText)
    {
        return PropertyValue::CreateString(captionText);
    }

    Thickness CreateThickness(int top,int bottom,int left,int right)
    {
        Thickness margin;
        margin.Bottom = bottom;
        margin.Left = left;
        margin.Right = right;
        margin.Top = top;
        return margin;
    }

    TextBlock CreateTextBlock(hstring textCaption)
    {
        TextBlock text;
        text.Text(textCaption);
        text.TextAlignment(TextAlignment::Center);
        text.Margin(CreateThickness(10, 10, 0, 10));
        return text;
    }

    StackPanel CreateStackPanel(hstring panelName, Orientation oriPosition)
    {
        StackPanel stPanel;
        stPanel.Children().Append(CreateTextBlock(panelName));
        stPanel.Children().Append(CreateTextBlock(L"Panel 1"));
        stPanel.Children().Append(CreateTextBlock(L"Panel 2"));
        stPanel.Children().Append(CreateTextBlock(L"Panel 3"));
        stPanel.Children().Append(CreateTextBlock(L"Panel 4"));
        stPanel.Children().InsertAt(4, CreateTextBlock(L"Panel 5"));
        stPanel.Children().InsertAt(5, CreateTextBlock(L"Panel 6"));
        stPanel.Orientation(oriPosition);
        return stPanel;
    }


    void OnLaunched(LaunchActivatedEventArgs const&)
    {

        auto panel1 = CreateStackPanel(L"StackPanel 1", Orientation::Horizontal);
        auto panel2 = CreateStackPanel(L"StackPanel 2", Orientation::Vertical);

        Border border;
        border.Margin(CreateThickness(15, 15, 15, 15));
        border.BorderThickness(CreateThickness(1,1, 1, 1));
        border.BorderBrush(SolidColorBrush(Colors::Red()));
        border.Background(SolidColorBrush(Colors::Brown()));


        border.Child(panel1);

        Border borderLeft;
        borderLeft.Margin(CreateThickness(15, 15, 15, 15));
        borderLeft.BorderThickness(CreateThickness(10, 10, 10, 10));
        borderLeft.BorderBrush(SolidColorBrush(Colors::Red()));
        borderLeft.Child(panel2);
        CornerRadius cornerRadius;
        cornerRadius.BottomLeft = 20;
        cornerRadius.BottomRight = 20;
        cornerRadius.TopLeft = 15;
        cornerRadius.TopRight = 15;
        borderLeft.CornerRadius(cornerRadius);

        StackPanel panel;
        panel.Children().Append(border);
        panel.Children().Append(borderLeft);
        panel.BorderThickness(CreateThickness(5, 5, 5, 5));
        panel.Background(SolidColorBrush(Colors::Yellow()));

        auto window = Window::Current();
        window.Content(panel);

        window.Activate();
    }
};


int __stdcall wWinMain(HINSTANCE, HINSTANCE, PWSTR, int)
{
    Application::Start([](auto &&) {make<App>(); });
    return 0;
}

output

Conclusion

I hope you understood how to use the Border control.