Jump to content
LaunchBox Community Forums
Mr. RetroLust

Alternate fields, Alternate Styles

Recommended Posts

I'm working on a custom LB Theme and it's going quite well, one thing I really can't seem to tackle is the following, something I wanted to do/see for a long time now. 
Normally in Big box you can alternate field and output in style, for example:

<TextBlock Text="Status: " Foreground="#5731F8" FontWeight="Bold" FontSize="24" />
<TextBlock Text="{Binding Path=ActiveGame.Version}" Foreground="#8287ED" FontWeight="Medium" FontSize="24" />

Resulting in something like -  Status: Good

But in Launchbox the first field "Status:" is already baked into the output resulting in "Status: Good" without the ability to be creative with the outcome much, I could alternate the colors on each row but then again when a field is missing in between the two rows you'll get the same colored rows on top of each other again.

<TextBlock Text="{Binding Status}" Visibility="{Binding StatusVisibility}" TextWrapping="Wrap" Margin="0,0,0,4" />

Example when a field is not present, than the alternating colors aren't effective:

1.thumb.png.9cbd0a474336b36c19337082acda1a04.png2.thumb.png.0a90251287e247b95971a55a52ce6484.png

What I really would like to be able to do:

4.thumb.png.4f9d567be5e037819d6bb7df5e47d2c1.png

I would love to separate these fields as I find it looks better (not so much in above example though, that was just a quick setup) but also an improvement in readability and fast eye navigation but I am at a loss when it comes to those binding paths and what can be done with them further in coding, I hope I expressed this well in proper english lol

Another wish I have is being able to style different outputs like "Good" in green "Imperfect" in orange and "Preliminary" in red, although I have a feeling this isn't possible.

I hope someone can help me explain if things can be done or impossible etc, hope I don't bother you by doing so, thanks for reading either way ;) 

@Jason Carr @Grila @eatkinola @Rincewind @Lordmonkus 

 

 

Edited by Mr. RetroLust
  • Like 1

Share this post


Link to post
Share on other sites

What you are trying to do will most likely require a custom control -- I cannot think of a way offhand to do this purely in XAML (and if there is one it'd likely be convoluted). If you're willing to do without the alternating row colors, the only code-behind you'd probably need is an IValueConverter, e.g., you could use an IValueConverter to split the "Status: good" string into "Status" and "good", then drop it in your Grid defined in XAML. Perhaps someone else can weigh in.

Edited by eatkinola
clarified alternating ROW colors
  • Thanks 1

Share this post


Link to post
Share on other sites
58 minutes ago, eatkinola said:

What you are trying to do will most likely require a custom control -- I cannot think of a way offhand to do this purely in XAML (and if there is one it'd likely be convoluted). If you're willing to do without the alternating row colors, the only code-behind you'd probably need is an IValueConverter, e.g., you could use an IValueConverter to split the "Status: good" string into "Status" and "good", then drop it in your Grid defined in XAML. Perhaps someone else can weigh in.

Thank you for explaining brother, much appreciated! This clears up the issue, I have no idea how to incorporate an iValueConverter so i'll leave it as it is.

Share this post


Link to post
Share on other sites

This can be done with a WPF DataGrid control. We actually do it in LaunchBox in the ListContentView.xaml file, I believe. This will do it though:

<DataGrid.RowStyle>
  <Style TargetType="{x:Type DataGridRow}">
    <Style.Triggers>
      <Trigger Property="AlternationIndex" Value="0">
        <Setter Property="Background" Value="White" />
      </Trigger>
      <Trigger Property="AlternationIndex" Value="1">
        <Setter Property="Background" Value="WhiteSmoke" />
      </Trigger>
      <DataTrigger Binding="{Binding Path=Selectable}" Value="False">
        <DataTrigger.Setters>
          <Setter Property="Background" Value="LightGray" />
        </DataTrigger.Setters>
      </DataTrigger>
    </Style.Triggers>
  </Style>
</DataGrid.RowStyle>

Stole it from here: https://stackoverflow.com/questions/11435501/how-to-make-a-wpf-datagrid-with-alternating-row-colors-and-a-fix-color-section/11437349

  • Like 1
  • Thanks 1

Share this post


Link to post
Share on other sites
16 minutes ago, Jason Carr said:

This can be done with a WPF DataGrid control. We actually do it in LaunchBox in the ListContentView.xaml file, I believe. This will do it though:


<DataGrid.RowStyle>
  <Style TargetType="{x:Type DataGridRow}">
    <Style.Triggers>
      <Trigger Property="AlternationIndex" Value="0">
        <Setter Property="Background" Value="White" />
      </Trigger>
      <Trigger Property="AlternationIndex" Value="1">
        <Setter Property="Background" Value="WhiteSmoke" />
      </Trigger>
      <DataTrigger Binding="{Binding Path=Selectable}" Value="False">
        <DataTrigger.Setters>
          <Setter Property="Background" Value="LightGray" />
        </DataTrigger.Setters>
      </DataTrigger>
    </Style.Triggers>
  </Style>
</DataGrid.RowStyle>

Stole it from here: https://stackoverflow.com/questions/11435501/how-to-make-a-wpf-datagrid-with-alternating-row-colors-and-a-fix-color-section/11437349

Cool! Thanks @Jason Carr I'll try to get it to work with this :)

Share this post


Link to post
Share on other sites

Wish there was an easier way to edit the themes - some kind of theme editor maybe. I've love to change a few things but not being a coder I find all the code a bit complicated. 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×