Jump to content
LaunchBox Community Forums

How to change options page font size in Big Box?


skizzosjt

Recommended Posts

So I am very familiar with CTC but grossly incompetent with XML. The few bits of XML I can edit are just because I'm learning them due to CTC has it's limits on what it was designed to do. If I want to do it and CTC can't I've learned how to deal with the edit outside of CTC. I've done my googling and lots of comparing to CTC's code it generates for Big Box (which is super different formatted it seems from how most people write by hand) and other themes code to try and figure out the right syntax and position to put it in the view file but whatever bits of font size changing lines or chunks of lines I've entered the best I do is either it changes nothing, or things get spaced out like there are extra blank lines in between each option (but no font size change), or crash the view and the default view is loaded, or just crash Big Box entirely instead lol....I'm at the point of just tossing stuff at the wall to see what sticks and am getting nowhere fast, so I need to wave the white flag and ask for some help!

 

This is regarding the Colorful Dark theme

For all I know I am not even editing the right views but it seems like they are OptionsPage and OptionsView. Please correct me if I'm mistaken!

I just want to edit the font size of the these options pages to be larger for easier reading from the couch

I would really appreciate help on this! Please and thanks!

 

Image for reference on the page I want to change font sizes of. The main options screen and all the various options that come up on the right when you select an option page on the left list.

image.thumb.png.797f42beb0ce1d992cfe18be3ada37c6.png

 

For ex, what I did in CTC to change the System Menu. I want the Options Menu to use same larger font size

image.thumb.png.7ef0947c9641a6829dcfad03a0b721f4.png

 

And here are the two pages code I've been playing with

OptionsPage

Spoiler
<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d"
             d:DesignHeight="300"
             d:DesignWidth="300"
             HorizontalAlignment="Stretch"
             VerticalAlignment="Stretch"
             FocusVisualStyle="{x:Null}"
             BorderThickness="0"
             Margin="0"
             Padding="0">
    <UserControl.Resources>
        <Style x:Key="ListBoxItemStyle" TargetType="ListBoxItem">
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}" />
            <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="BorderBrush" Value="Transparent" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                        <Border x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1"
						Padding="0" SnapsToDevicePixels="True">
                            <ContentPresenter HorizontalAlignment="Stretch"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            Content="{TemplateBinding Content}"
                            ContentStringFormat="{TemplateBinding ContentStringFormat}"
                            ContentTemplate="{TemplateBinding ContentTemplate}"
                            SnapsToDevicePixels="True" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsMouseOver" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="White" />
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="False" />
                                    <Condition Property="IsSelected" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="White" />
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="True" />
                                    <Condition Property="IsSelected" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="White" />
                            </MultiTrigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ListBoxStyle" TargetType="ListBox">
            <Setter Property="ItemContainerStyle" Value="{DynamicResource ListBoxItemStyle}"></Setter>
            <Setter Property="BorderBrush" Value="Transparent" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="Foreground" Value="White"></Setter>
            <Setter Property="FontFamily" Value="LAUNCHBOX_ROOT_FOLDER/Themes/Colorful - Light Theme/Fonts/RobotoCondensed-Regular_0.ttf#Roboto Condensed" />
            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="Margin" Value="0" />
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
        </Style>
    </UserControl.Resources>
    <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
		<Grid.ColumnDefinitions>
			<ColumnDefinition Width="5*" />
			<ColumnDefinition Width="100*" />
			<ColumnDefinition Width="5*" />
		</Grid.ColumnDefinitions>
		<Grid.RowDefinitions>
			<RowDefinition Height="5*" />
			<RowDefinition Height="100*" />
			<RowDefinition Height="5*" />
		</Grid.RowDefinitions>
		<ListBox Name="MenuItems" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Style="{DynamicResource ListBoxStyle}" Grid.Column="1" Grid.Row="1" />
	</Grid>
</UserControl>

 

 

OptionsView

Spoiler
<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
             xmlns:cal="http://www.caliburnproject.org"
             mc:Ignorable="d"
             d:DesignHeight="562"
             d:DesignWidth="1000"
             FocusVisualStyle="{x:Null}"
             BorderThickness="0"
             Margin="0"
             Padding="0"
             Background="#424242">
    <UserControl.Resources>
        <Style x:Key="ListBoxItemStyle" TargetType="ListBoxItem">
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}" />
            <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="BorderBrush" Value="Transparent" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                        <Border x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1"
						Padding="0" SnapsToDevicePixels="True">
                            <ContentPresenter HorizontalAlignment="Stretch"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            Content="{TemplateBinding Content}"
                            ContentStringFormat="{TemplateBinding ContentStringFormat}"
                            ContentTemplate="{TemplateBinding ContentTemplate}"
                            SnapsToDevicePixels="True" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsMouseOver" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="White" />
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="False" />
                                    <Condition Property="IsSelected" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="White" />
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="True" />
                                    <Condition Property="IsSelected" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="White" />
                            </MultiTrigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ListBoxStyle" TargetType="ListBox">
            <Setter Property="ItemContainerStyle" Value="{DynamicResource ListBoxItemStyle}"></Setter>
            <Setter Property="BorderBrush" Value="Transparent" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="Foreground" Value="White"></Setter>
            <Setter Property="FontFamily" Value="LAUNCHBOX_ROOT_FOLDER/Themes/Colorful - Light Theme/Fonts/RobotoCondensed-Regular_0.ttf#Roboto Condensed" />
            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="Margin" Value="0" />
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
        </Style>
    </UserControl.Resources>
    <Canvas Name="Canvas">
        <Grid Height="{Binding ElementName=Canvas, Path=ActualHeight}" Width="{Binding ElementName=Canvas, Path=ActualWidth}">
			<Grid.Background>
				<SolidColorBrush Color="White" Opacity="0.0" />
			</Grid.Background>
			<Grid.ColumnDefinitions>
				<ColumnDefinition Width="35*" />
				<ColumnDefinition Width="4*" />
				<ColumnDefinition Width="96*" />
			</Grid.ColumnDefinitions>
            <Image Grid.Column="1" Grid.ColumnSpan="2" Source="pack://siteoforigin:,,,/Themes/Colorful - Light Theme/Media/Colorful_img/Colorful_Setting_background.jpg" RenderOptions.BitmapScalingMode="HighQuality" Stretch="Fill"  />
            <DockPanel Grid.Column="0">
                <Image DockPanel.Dock="Top" Source="pack://siteoforigin:,,,/Themes/Colorful - Light Theme/Media/Colorful_img/Colorful_SystemView_Logo.png" RenderOptions.BitmapScalingMode="HighQuality" />

                <ListBox Name="MenuItems" Style="{DynamicResource ListBoxStyle}">
					<i:Interaction.Triggers>
						<i:EventTrigger EventName="MouseDoubleClick">
							<cal:ActionMessage MethodName="OnEnter" />
						</i:EventTrigger>
					</i:Interaction.Triggers> 
                </ListBox>
            </DockPanel>
			<ContentControl Name="OptionsPageViewModel" FocusVisualStyle="{x:Null}" Grid.Column="2" />
		</Grid>
	</Canvas>
</UserControl>

 

Link to comment
Share on other sites

You're images don't appear to have pasted correctly and are broken links so I'm flying a BIT blind here. If the desire is to change the font size on the individual options shown on the right side of the UI then there is actually a different view file for each type of option control. If you look in the default there is about 5 different view files you haven't mentioned that start with the word "Option" these are the view files that handle the actual text you see in the options and can be altered to increase the size of the font.

  • Thanks 1
Link to comment
Share on other sites

21 hours ago, C-Beats said:

You're images don't appear to have pasted correctly and are broken links so I'm flying a BIT blind here. If the desire is to change the font size on the individual options shown on the right side of the UI then there is actually a different view file for each type of option control. If you look in the default there is about 5 different view files you haven't mentioned that start with the word "Option" these are the view files that handle the actual text you see in the options and can be altered to increase the size of the font.

Hey C-beat thanks for the response and giving me a helping hand here! I checked this post on my work laptop and noticed the images were broken also. However, now that I am home on the same system I made the post with, the images are displaying fine in the original post! They displayed fine when I made the post too. So that all seems weird. Either way, let's try again with uploading new images...

 

This System Menu I changed the font size with CTC. So my goal is to have all Options pages have same larger matching size as shown here

BigBoxSystemMenu.thumb.png.dab5cdac3d49958b8ccbaeb0fbcb01c9.png

 

Here the current state of the Options page. I would like both the left hand selection list, and the actual options on right hand side to both have a larger font size.

BigBoxOptionsMenu.thumb.png.cf172f51a11a0237606386aec411df35.png

 

I did notice all the various Options<*View> views. my initial thought was I should try and get the Options page main left hand list font size larger, and once I figure that out I could use that knowledge to adapt it to all the individual various option pages. I'm not sure if this stuff actually translates from these various views like that or not.

 

So here is what is confusing me, why don't any of these Option view files have a "FontSize" parameter in them? Or at least, these Colorful theme ones sure don't. I noticed the default theme does and maybe some other custom themes I download. Some do, some don't, some don't even have these view files since they just use the default ones.

I'm at the point where I understand everything you shared in your comment, but I don't know what lines to edit, or what lines to add. Almost everything I try so far does not result in a desirable outcome.

 

I did get some other stuff accomplished just now. Since I've been staring at these views so long I happened to notice there were a handful of wrong directory paths for font files and images. After correcting that, this looks much better now, my options pages are actually themed. But I still need help understanding how to get the font larger for most of these Option views

Now with proper paths in place, I get the correct font and images and background working. I always wondered why the Options page looked so empty compared to the rest of the theme lol

BigBoxOptionsMenuFixed.thumb.png.96c0372078c812b95da555abe986cfc5.png

 

So here is the OptionsCheckBoxMenuItemView code for Colorful. So far this is the only options view I have been able to get do a FontSize change. Using same syntax in other views is not giving me the same result. The only bit I added was FontSize="20" (as in there was no FontSize parameter in this view until I just added it)

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
             xmlns:cal="http://www.caliburnproject.org"
             mc:Ignorable="d"
             d:DesignHeight="300"
             d:DesignWidth="300"
             FocusVisualStyle="{x:Null}">
    <CheckBox Name="CheckBox" IsChecked="{Binding IsChecked}" >
        <Label Foreground="White" Content="{Binding Name}" Padding="0" Margin="0" FontSize="20"></Label>
    </CheckBox>
</UserControl>

 

I must have not tried it on this specific Options view last night, because now I'm back to trying to do the same for the other various Options views and it's not working which is the same behavior I've been getting as I try to figure this out throughout the week. Unfortunately I also am lost on getting the left hand side list to change. This seems odd because I can change colors on lots of these other bits of text, including the left hand side list, but if I stick in the same FontSize="X" parameter it doesn't do anything.

 

For example, I know I'm editing the appropriate line due to changing the color here from white to red, but FontSize="X" doesn't make the font size change. I must be doing something wrong. This code and image is OptionsControllerButtonMenuItemView. I added in FontSize="25" and also changed Foreground value from White to Red

BigBoxControllerButtonMenu.thumb.png.27473d367280746dcfe05178b771f6ac.png

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d"
             d:DesignHeight="300"
             d:DesignWidth="300"
             HorizontalAlignment="Stretch"
			 MaxWidth="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type ListBox}}}"
             FocusVisualStyle="{x:Null}">
	<Grid>
		<Grid.ColumnDefinitions>
			<ColumnDefinition Width="40*" />
			<ColumnDefinition Width="60*" />
		</Grid.ColumnDefinitions>
		<TextBlock Name="Name" Foreground="Red" TextTrimming="WordEllipsis" HorizontalAlignment="Stretch" Grid.Column="0" FontSize="25" />
        <TextBlock Name="Text" Foreground="#f7f7f7" TextTrimming="WordEllipsis" HorizontalAlignment="Stretch" Grid.Column="1" />
	</Grid>
</UserControl>

 

 

On the OptionsView I see a little different syntax and have tried this kind of stuff with no luck. I can change color, example shows black instead of white, but I cannot get font size to change. All I did was change Foreground value from White to Black, and added in the line (line #72) <Setter Property="FontSize" Value="35" /> I've tried placing it in different spots too.

BigBoxOptionMenuEdited.thumb.png.edacb05c35b48053e02c49f8d3185d16.png

OptionsView code with those above mentioned edits. Only gets font color to change, but not the font size.

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
             xmlns:cal="http://www.caliburnproject.org"
             mc:Ignorable="d"
             d:DesignHeight="562"
             d:DesignWidth="1000"
             FocusVisualStyle="{x:Null}"
             BorderThickness="0"
             Margin="0"
             Padding="0"
             Background="#424242">
    <UserControl.Resources>
        <Style x:Key="ListBoxItemStyle" TargetType="ListBoxItem">
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}" />
            <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="BorderBrush" Value="Transparent" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                        <Border x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1"
						Padding="0" SnapsToDevicePixels="True">
                            <ContentPresenter HorizontalAlignment="Stretch"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            Content="{TemplateBinding Content}"
                            ContentStringFormat="{TemplateBinding ContentStringFormat}"
                            ContentTemplate="{TemplateBinding ContentTemplate}"
                            SnapsToDevicePixels="True" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsMouseOver" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="White" />
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="False" />
                                    <Condition Property="IsSelected" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="White" />
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="True" />
                                    <Condition Property="IsSelected" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="#5abc3c" />
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="White" />
                            </MultiTrigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ListBoxStyle" TargetType="ListBox">
            <Setter Property="FontSize" Value="35" />
            <Setter Property="ItemContainerStyle" Value="{DynamicResource ListBoxItemStyle}"></Setter>
            <Setter Property="BorderBrush" Value="Transparent" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="Foreground" Value="Black"></Setter>
            <Setter Property="FontFamily" Value="LAUNCHBOX_ROOT_FOLDER/Themes/Colorful - Dark [Couch Edition] - CTC v3.1.5/Fonts/RobotoCondensed-Regular_0.ttf#Roboto Condensed" />
            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="Padding" Value="0" />
            <Setter Property="Margin" Value="0" />
            <Setter Property="FocusVisualStyle" Value="{x:Null}" />
        </Style>
    </UserControl.Resources>
    <Canvas Name="Canvas">
        <Grid Height="{Binding ElementName=Canvas, Path=ActualHeight}" Width="{Binding ElementName=Canvas, Path=ActualWidth}">
			<Grid.Background>
				<SolidColorBrush Color="White" Opacity="0.0" />
			</Grid.Background>
			<Grid.ColumnDefinitions>
				<ColumnDefinition Width="35*" />
				<ColumnDefinition Width="4*" />
				<ColumnDefinition Width="96*" />
			</Grid.ColumnDefinitions>
            <Image Grid.Column="1" Grid.ColumnSpan="2" Source="pack://siteoforigin:,,,/Themes/Colorful - Dark [Couch Edition] - CTC v3.1.5/Media/Colorful_img/Colorful_Setting_background.jpg" RenderOptions.BitmapScalingMode="HighQuality" Stretch="Fill"  />
            <DockPanel Grid.Column="0">
                <Image DockPanel.Dock="Top" Source="pack://siteoforigin:,,,/Themes/Colorful - Dark [Couch Edition] - CTC v3.1.5/Media/Colorful_img/Colorful_SystemView_Logo.png" RenderOptions.BitmapScalingMode="HighQuality" />
                <ListBox Name="MenuItems" Style="{DynamicResource ListBoxStyle}">
					<i:Interaction.Triggers>
						<i:EventTrigger EventName="MouseDoubleClick">
							<cal:ActionMessage MethodName="OnEnter" />
						</i:EventTrigger>
					</i:Interaction.Triggers> 
                </ListBox>
            </DockPanel>
			<ContentControl Name="OptionsPageViewModel" FocusVisualStyle="{x:Null}" Grid.Column="2" />
		</Grid>
	</Canvas>
</UserControl>

 

 

Any idea what I need to do different to achieve my larger font size goal? On the positive side, I made some progress tonight thanks to your help!

I certainly appreciate your continued help to guide me through this font size edit!

Link to comment
Share on other sites

Well, after a grind session on Sat I finally wrapped up all this font resizing and other customization business. Boy, it was not straight forward, and as I feared, required adding code rather than editing existing code. The theme clearly intended to use defaults with omission of the parameter and value anywhere. Went a step further and figured out that converter/ScaleConverter stuff. Figured if I'm gonna edit this, might as well do it right to match like how rest of theme can scale properly.  Though, maybe someone can give me a hand here and explain why it seems like the only thing that is still confusing the heck out of me is why when I use scaling on OptionsCheckBoxMenuItemView it doesn't look right when I use a different resolution than the source resolution? (which I am using 4K for that) All other bits of text scale fine across all various options views.

I just tried a random thought of removing the scaling from this view to see what would happen and it still scales, and does so appropriately??!! WHAT?! LOL I'M EVEN MORE CONFUSED NOW

So that was literally my last goal to achieve, but I have no idea WHY it's working like this. If I use static values and no scaling on other bits of text, they as expected look too large/small when I use a different resolution.

If you know what is going on here and can offer any explanation, I'd love to know what going on under the hood!

 

Some images for reference. These first two show how scaling would be incorrect for checkboxes when I had scaling used on the font size

Here it is correct - my desktop resolution at 3840x2160 (4K)

BigBoxOptionsCorrect.thumb.png.76d8f066bdff107bf4a37bf77834962a.png

 

Here it is incorrect - my desktop resolution down to 1920x1080

BigBoxOptionsIncorrectScaling.thumb.png.c6a226b49914a00b80469126a0bfe831.png

 

 

However, below now I have removed scaling the font size from the checkboxes, AND removed scaling the font size of the left hand side list too. As expected, the list looks incorrect being too large because I reduced my resolution from 4K down to 1080p. However, not as expected, the checkboxes did magically scale properly here. (compare to the first photo above - checkboxes look the same) How in the world does a static value scale like this when other static values don't?

image.thumb.png.1f955ccd05560675030b972a35edda6d.png

Link to comment
Share on other sites

5 hours ago, C-Beats said:

I'd have to look at the code closer but it's entirely possible that control is in a ViewBox which is a standard WPF control that scales the stuff in them.

At one point I figured out how to scale the actual size of the check box using some transforming tags (I forget their exact name). When I was playing with making the check box itself bigger, I noticed the contents within it, the text, also scaled. Sounds like that could be connected to behavior I see and what you describe? Because as I think about it, the checkboxes themselves are scaling properly too when using various resolutions. Even though I did not put any scaling code into the checkboxes themselves. They are the same size no matter what resolution I pick. The only time I saw them change size is with additional code, the transforming bit I mentioned.

Thanks for entertaining my curiosity questions here!

Link to comment
Share on other sites

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...