User Interfaces
The User Interface can be customized to whatever you need.
The current library includes 15 controls at your disposal, but can easily be extended by custom controls or user controls.
SetupIncluded with the library are some defaults. This includes a Skin, Skin Definition, and Font.
The actual skin is just any graphics file that contains all the individual parts of your user interface.
The skin definition is a XML file that contains the size and position of each part.
The font can be any SpriteFont you want.
User interfaces are created by adding to your content directory a XAML file.
This XAML file will be loaded in your code and defines how your User Interface will look.
XAML Controls and Properties
User Interface
- Properties
- Name: Name of the user interface
- Skin: Location of the skin to use
- Font: Location of the font to use
All Controls
- Properties
- Name: Name of the control
- Opacity: How transparent the control is
- IsEnabled: Whether the control updates
- IsVisible: Whether the control renders
- Width: How wide the control is
- Height: How tall the control is
- X: Horizontal position of the control on the screen
- Y: Vertical position of the control on the screen
Border
- BorderColor: Color of the border
Button
- Text: The content of the button
- ForegroundColor: The text color
- OnClick: Action to invoke when clicked
CelestialClock
- Month: Numeric month
- Day: Numeric day
- Year: Numeric year
- Hour: Numeric hour
- Minute: Numeric minute
- BorderColor: Color of the border
CheckBox
- IsChecked: Whether the check box is checked
- HighlightColor: Color of the control when mouse moves over it
Console
- BackgroundColor: Color of the background
- IsExpanded: Whether the control is expanded
- ExpandSpeed: How fast the console drops down
ImageButton
- ImageSource: Location of the image
- HighlightedImageSource: Location of the image when control is highlighted
- ClickedImageSource: Location of the image when control is clicked
- OnClick Action that is invoked when control is clicked.
Panel
- BorderColor Color of the border
- BackgroundColor: Color of the background
ProgressBar
- Value Value of the control
- Minimum: Minimum value of the control
- Maximum: Maximum value of the control
- FillColor: Color the progress bar fill is
- BorderColor: Color of the border
ProgressSelector
- Value Value of the control
- Minimum: Minimum value of the control
- Maximum: Maximum value of the control
- FillColor: Color the progress bar fill is
- BorderColor: Color of the border
RadioButton
- Text: Text to be displayed next to radio button
- Group: Group at which the control belongs to.
- IsChecked: Whether the radio button is checked
- HighlightColor: Color when mouse is over control
- ForegroundColor: Color of the text
Selector
- SelectedIndex: Which index is selected for items
- ItemsSource: Comma delimited list of items
- ForegroundColor: Color of the text
- BorderColor: Color of the border
Slider
- Value Value of the control
- Minimum: Minimum value of the control
- Maximum: Maximum value of the control
- GrooveColor: Color of the background groove
- SlideColor: Color of the slide
TextBlock
- Text: What text to be displayed
- ForegroundColor: Color of the text
TextBox
- Text: What text to be displayed and edited
- BorderColor: Color of the borders
- ForegroundColor: Color of the text
UpDown
- Value Value of the control
- Minimum: Minimum value of the control
- Maximum: Maximum value of the control