Nevron Open Vision Documentation
Pair Box

The pair box is represented by the NPairBox class. It is a widget that pairs two arbitrary widgets, which is a commonly used UI construction. By using pair boxes you can easily create buttons with image and text, combo box and list box items with image and so on. In case the BoxesRelations is not set to Overlay, the widgets are internally arranged with a Stack Layout.

Child Elements

The pair box is a branch node containing two widgets - Box1 and Box2. The following code example creates an image and text pair box:

Pair Box Example
Copy Code
NPairBox pairBox = new NPairBox();
pairBox.Box1 = new NImageBox(NImage.FromFile("C:\\SomeImage.png")));
pairBox.Box2 = new NLabel("Some Text");
pairBox.BoxesRelation = ENPairBoxRelation.Box1BeforeBox2;

You can also use the static Create method of the NPairBox class to create image and text pair boxes even faster:

Pair Box Create Method
Copy Code
NPairBox pairBox = NPairBox.Create(NImage.FromFile("C:\\SomeImage.png"), "Some Text");
Properties

The pair box exposes the following properties:

Name Description
Spacing Defines the spacing between the boxes of the pair box
BoxesRelation

Defines the relative placement of the boxes. Can be one of the following:

  • Overlay - Specifies that box1 and box2 share the same space.
  • Box1AboveBox2 - Specifies that box1 is displayed vertically above box2.
  • Box2AboveBox1 - Specifies that box2 is displayed vertically above box1.
  • Box1BeforeBox2 - Specifies that box1 is displayed horizontally before box2.
  • Box2BeforeBox1 - Specifies that box2 is displayed horizontally before box1.
FillMode Determines the fill mode of the stack layout the 2 boxes are arranged with. Has effect only if BoxesRelation is not set to Overlay
FitMode Determines the fit mode of the stack layout the 2 boxes are arranged with. Has effect only if BoxesRelation is not set to Overlay
Pair Box and Unisize Box

The sizing behavior of NUnisizeBox is described by the Unisize Box topic. Because the pair box is often used in conjunction with the unisize box, the NPairBox class provides a constructor that lets you easily embed the boxes passes as arguments inside unisize group boxes. For example:

Pair Box with Unisize Boxes Examples
Copy Code
NStackPanel stack = new NStackPanel();
NPairBox pair1 = new NPairBox("I am small", new NButton("I am larger button than small button"), true);
stack.Add(pair1);
NPairBox pair2 = new NPairBox("I am larger than small", new NButton("I am small button"), true);
stack.Add(pair2);
NUniSizeBoxGroup group = new NUniSizeBoxGroup(stack);

This code produces the following image:

This is because the widgets created for the labels and buttons in the previous example are embedded inside unisize boxes (the last parameter of the NPairBox constructor is true).

When using this technique it is nice to know that by default the NUnisizeBox assigned as Box1 has the "Box1" sizing group, while the NUnisizeBox assigned as Box2 has the "Box2" sizing group.

See Also
Send Feedback