Skip to content

Commit

Permalink
Details View & Grid View: Display stars visuals for user, critic and …
Browse files Browse the repository at this point in the history
…community scores
  • Loading branch information
darklinkpower committed Nov 22, 2024
1 parent fdacf97 commit 4febee2
Show file tree
Hide file tree
Showing 3 changed files with 124 additions and 21 deletions.
43 changes: 43 additions & 0 deletions source/Constants.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -337,4 +337,47 @@
RenderingBias="Performance"
ShadowDepth="0"
Color="#03121212" />

<Geometry x:Key="StarShapeGeometry">M17.7835 1.05234C17.8961 0.714958 18.3733 0.714958 18.4859 1.05234L22.4334 12.8804C22.4839 13.0316 22.6253 13.1335 22.7846 13.1335H35.5375C35.8985 13.1335 36.0461 13.5975 35.7513 13.806L25.4512 21.0917C25.318 21.1859 25.2622 21.3563 25.3138 21.5112L29.2521 33.3116C29.3654 33.651 28.9792 33.9377 28.6871 33.7311L18.3485 26.4182C18.2204 26.3276 18.049 26.3276 17.9209 26.4182L7.58236 33.7311C7.29026 33.9377 6.90407 33.651 7.01734 33.3116L10.9556 21.5112C11.0073 21.3563 10.9515 21.1859 10.8182 21.0917L0.518159 13.806C0.223381 13.5975 0.370904 13.1335 0.731971 13.1335H13.4848C13.6441 13.1335 13.7856 13.0316 13.836 12.8804L17.7835 1.05234Z</Geometry>
<DataTemplate x:Key="StarItemTemplate">
<Path Data="{StaticResource StarShapeGeometry}"
Stroke="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType=ContentControl}, FallbackValue=Gold}"
StrokeThickness="2"
SnapsToDevicePixels="True"
Fill="{Binding Path=Background, RelativeSource={RelativeSource AncestorType=ContentControl}}" />
</DataTemplate>

<DataTemplate x:Key="FiveStarTemplate">
<StackPanel Orientation="Horizontal">
<ContentPresenter ContentTemplate="{StaticResource StarItemTemplate}" />
<ContentPresenter ContentTemplate="{StaticResource StarItemTemplate}" Margin="5,0,0,0"/>
<ContentPresenter ContentTemplate="{StaticResource StarItemTemplate}" Margin="5,0,0,0"/>
<ContentPresenter ContentTemplate="{StaticResource StarItemTemplate}" Margin="5,0,0,0"/>
<ContentPresenter ContentTemplate="{StaticResource StarItemTemplate}" Margin="5,0,0,0"/>
</StackPanel>
</DataTemplate>

<DataTemplate x:Key="FiveStarScoreTemplate">
<Viewbox HorizontalAlignment="Left" VerticalAlignment="Stretch"
SnapsToDevicePixels="True"
Margin="{Binding Path=Padding, RelativeSource={RelativeSource AncestorType=ContentControl}}">
<Grid x:Name="GridScore" Tag="{Binding}"
Visibility="{Binding RelativeSource={RelativeSource Self}, Path=Tag, Converter={StaticResource NullToVisibilityConverter}}">
<TextBlock x:Name="StarsOverlayProxy" Visibility="Collapsed"
Text="{Binding ElementName=GridScore, Path=Tag, TargetNullValue=0}" />
<Viewbox Width="100" HorizontalAlignment="Left">
<ContentControl Background="{Binding Path=Background, RelativeSource={RelativeSource AncestorType=ContentControl}}"
Foreground="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType=ContentControl}}"
ContentTemplate="{StaticResource FiveStarTemplate}" />
</Viewbox>
<Border Width="{Binding ElementName=StarsOverlayProxy, Path=Text}" HorizontalAlignment="Left">
<Viewbox Width="100" HorizontalAlignment="Left">
<ContentControl Foreground="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType=ContentControl}}"
Background="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType=ContentControl}}"
ContentTemplate="{StaticResource FiveStarTemplate}" />
</Viewbox>
</Border>
</Grid>
</Viewbox>
</DataTemplate>
</ResourceDictionary>
54 changes: 42 additions & 12 deletions source/Views/DetailsViewGameOverview.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -209,8 +209,8 @@
<StackPanel VerticalAlignment="Bottom" DockPanel.Dock="Left">
<DockPanel HorizontalAlignment="Center">
<Image Name="PART_ImageIcon"
MaxWidth="48"
MaxHeight="48"
MaxWidth="32"
MaxHeight="32"
Margin="0,0,10,0"
VerticalAlignment="Center"
DockPanel.Dock="Left"
Expand All @@ -223,7 +223,7 @@
Color="#0d0d0d" />
</Image.Effect>
<Image.Clip>
<RectangleGeometry RadiusX="4" RadiusY="4" Rect="0,0,48,48" />
<RectangleGeometry RadiusX="4" RadiusY="4" Rect="0,0,32,32" />
</Image.Clip>
</Image>

Expand Down Expand Up @@ -1092,9 +1092,19 @@
<TextBlock Text="{DynamicResource LOCCommunityScore}" />
</StackPanel>
</Label>
<TextBlock Name="PART_TextCommunityScore"
VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<StackPanel Orientation="Horizontal"
Visibility="{Binding ElementName=PART_TextCommunityScore, Path=Visibility}">
<TextBlock Name="PART_TextCommunityScore" VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<ContentControl Content="{Binding Game.CommunityScore}"
Padding="6,0,0,4"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Background="Transparent"
Foreground="{Binding ElementName=PART_TextCommunityScore, Path=Foreground}"
Height="{Binding ElementName=PART_TextCommunityScore, Path=ActualHeight}"
ContentTemplate="{StaticResource FiveStarScoreTemplate}"/>
</StackPanel>
<Label Name="PART_ElemCriticScore">
<StackPanel Orientation="Horizontal">
<TextBlock
Expand All @@ -1106,9 +1116,19 @@
<TextBlock Text="{DynamicResource LOCCriticScore}" />
</StackPanel>
</Label>
<TextBlock Name="PART_TextCriticScore"
VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<StackPanel Orientation="Horizontal"
Visibility="{Binding ElementName=PART_TextCriticScore, Path=Visibility}">
<TextBlock Name="PART_TextCriticScore" VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<ContentControl Content="{Binding Game.CriticScore}"
Padding="6,0,0,4"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Background="Transparent"
Foreground="{Binding ElementName=PART_TextCriticScore, Path=Foreground}"
Height="{Binding ElementName=PART_TextCriticScore, Path=ActualHeight}"
ContentTemplate="{StaticResource FiveStarScoreTemplate}"/>
</StackPanel>
<Label Name="PART_ElemUserScore">
<StackPanel Orientation="Horizontal">
<TextBlock
Expand All @@ -1120,9 +1140,19 @@
<TextBlock Text="{DynamicResource LOCUserScore}" />
</StackPanel>
</Label>
<TextBlock Name="PART_TextUserScore"
VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<StackPanel Orientation="Horizontal"
Visibility="{Binding ElementName=PART_TextUserScore, Path=Visibility}">
<TextBlock Name="PART_TextUserScore" VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<ContentControl Content="{Binding Game.UserScore}"
Padding="6,0,0,4"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Background="Transparent"
Foreground="{Binding ElementName=PART_TextUserScore, Path=Foreground}"
Height="{Binding ElementName=PART_TextUserScore, Path=ActualHeight}"
ContentTemplate="{StaticResource FiveStarScoreTemplate}"/>
</StackPanel>
<Label Name="PART_ElemFeatures">
<StackPanel Orientation="Horizontal">
<TextBlock
Expand Down
48 changes: 39 additions & 9 deletions source/Views/GridViewGameOverview.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -575,9 +575,19 @@
<TextBlock Text="{DynamicResource LOCCommunityScore}" />
</StackPanel>
</Label>
<TextBlock Name="PART_TextCommunityScore"
VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<StackPanel Orientation="Horizontal"
Visibility="{Binding ElementName=PART_TextCommunityScore, Path=Visibility}">
<TextBlock Name="PART_TextCommunityScore" VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<ContentControl Content="{Binding Game.CommunityScore}"
Padding="6,0,0,4"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Background="Transparent"
Foreground="{Binding ElementName=PART_TextCommunityScore, Path=Foreground}"
Height="{Binding ElementName=PART_TextCommunityScore, Path=ActualHeight}"
ContentTemplate="{StaticResource FiveStarScoreTemplate}"/>
</StackPanel>

<Label Name="PART_ElemCriticScore">
<StackPanel Orientation="Horizontal">
Expand All @@ -590,9 +600,19 @@
<TextBlock Text="{DynamicResource LOCCriticScore}" />
</StackPanel>
</Label>
<TextBlock Name="PART_TextCriticScore"
VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<StackPanel Orientation="Horizontal"
Visibility="{Binding ElementName=PART_TextCriticScore, Path=Visibility}">
<TextBlock Name="PART_TextCriticScore" VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<ContentControl Content="{Binding Game.CriticScore}"
Padding="6,0,0,4"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Background="Transparent"
Foreground="{Binding ElementName=PART_TextCriticScore, Path=Foreground}"
Height="{Binding ElementName=PART_TextCriticScore, Path=ActualHeight}"
ContentTemplate="{StaticResource FiveStarScoreTemplate}"/>
</StackPanel>

<Label Name="PART_ElemUserScore">
<StackPanel Orientation="Horizontal">
Expand All @@ -605,9 +625,19 @@
<TextBlock Text="{DynamicResource LOCUserScore}" />
</StackPanel>
</Label>
<TextBlock Name="PART_TextUserScore"
VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<StackPanel Orientation="Horizontal"
Visibility="{Binding ElementName=PART_TextUserScore, Path=Visibility}">
<TextBlock Name="PART_TextUserScore" VerticalAlignment="Center"
Style="{DynamicResource TextBlockGameScore}" />
<ContentControl Content="{Binding Game.UserScore}"
Padding="6,0,0,4"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Background="Transparent"
Foreground="{Binding ElementName=PART_TextUserScore, Path=Foreground}"
Height="{Binding ElementName=PART_TextUserScore, Path=ActualHeight}"
ContentTemplate="{StaticResource FiveStarScoreTemplate}"/>
</StackPanel>

<Label Name="PART_ElemFeatures">
<StackPanel Orientation="Horizontal">
Expand Down

0 comments on commit 4febee2

Please sign in to comment.