Jump to content
LaunchBox Community Forums

Recommended Posts

HexControls

View File

A collection of custom user controls to make custom themes easier.

I will be updating the tool periodically with new features.

Install for use

  • Download HexControls.dll
  • place the file in the plugins folder in your theme

Screenshots Control.

Description

A control to randomly display a list of screenshots available for a game. It will stretch itself to the bounds of the container it is placed in.

Default Use in a Theme

<Hex:Screenshots/>

Advanced Use

Using the properties below will allow the user to effect the maximum number of screenshots shown, spacing  and border controls

Properties

ScreenshotBorderColor: Border Color
ScreenshotPanelOrientation: "Vertical"  or "Horizontal" Direction Screenshot span
ScreenshotMaxImages:   Number of maximum screenshots shown (Default is 4)
ScreenshotBorderSize:  How thick the border around the screenshot is. Setting the bordersize to zero will remove the border
ScreenshotCornerRadius: Curve around all edges of a scrrenshot
ScreenshotMarginSize= Space Between each screenshots edge

Example

 

      <Hex:Screenshots ScreenshotBorderColor="Blue"
                       ScreenshotPanelOrientation="Vertical"
                       ScreenshotMaxImages="10"
                       ScreenshotBorderSize="15"
                       ScreenshotCornerRadius="13"
                       ScreenshotMarginSize="5"
                       Grid.Column="15"
                       Grid.Row="3"
                       Grid.RowSpan="15"
                       Grid.ColumnSpan="15">

      </Hex:Screenshots>

Capture4.PNG.d32bfd684493b3001dafb158ed1

Star Rating

Default Use in a Theme

  • In a Game view call
     <Hex:StarRating /> 
    • Pretty much it for the default use. The control will size to whatever space it is placed in.
    • This will get you a red star with white border for an on star and a black star with white border for an off star.

Capture.thumb.PNG.399f409c649aefa0e768b28abd0b7b7e.PNG

Advanced Use

I've set up the control to allow users to do two things:

  • Modify the color properties for Star On/Star Off and their border
  • Modify two Star vectors layered on top of each other; this has been created to allow for more vibrant star designs using transparency.

Properties:

ColorOnStarOneFill - On Fill Color  for Star one
ColorOnStarOneBorder -  On Border Color for Star One
ColorOnStarTwoFill - On Fill Color for Star Two
ColorOnStarTwoBorder -  On Border Color for Star Two

ColorOffStarOneFill - Off Fill Color for Star One
ColorOffStarOneBorder -  Off Border Color for Star One
ColorOffStarTwoFill - Off Fill Color for Star Two
ColorOffStarTwoBorder - Off Border Color for Star Two
                                      

StarsMarginSize -  Margin Between Each star
BorderStarOneSize - Size of the Border for Star One
BorderStarTwoSize -  Size of the Border for Size Two

So, using these settings

 
<Hex:StarRating Panel.ZIndex="1000"
                             Grid.Column="11"
                             Grid.Row="1"
                             Grid.ColumnSpan="10"
                            
                             Grid.RowSpan="3"
                             HorizontalAlignment="Left"
                             VerticalAlignment="Top"
                                            
                             ColorOnStarOneFill="#BBC49A6C"
                             ColorOnStarOneBorder="#11111111"
                             ColorOnStarTwoFill="#BBC49A6C"
                             ColorOnStarTwoBorder="#11FFFFFF"
                                            
                             ColorOffStarOneFill="Black"
                             ColorOffStarOneBorder="White"
                             ColorOffStarTwoFill="#66000000"
                             ColorOffStarTwoBorder="White"
                             StarsMarginSize="10"
                             BorderStarOneSize="8"
                             BorderStarTwoSize="20"
                             SnapsToDevicePixels="True"/>

 

Will give you a result like this.

Capture2.PNG.c0513aa6431709b7bd1f434173e6d20f.PNG

 


 

  • Like 2
Link to comment
Share on other sites

  • 1 year later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...