none
Segoe UI Font not applied in ComboBox Flyout RRS feed

  • Question

  • I have the following Problem:

    I'm using a Combobox in C# Windows Phone 8.1 like the following:

    <ComboBox FontFamily="Segoe UI Symbol" />

    Now when I have 5 or less items in this Combobox, the Font Segoe UI Symbol gets shown right in the Flyout (unfortunately I can't add an image here yet).

    BUT if I have more then 5 items, the ComboboxPicker shows up and it does not use the Font Segoe UI Symbol anymore. I get a rectangle shown where my Icon should have been.

    How can I change it to show the content in the Segoe UI Symbol Font?


    • Edited by vinc() Friday, July 10, 2015 7:53 AM update Title
    Thursday, July 9, 2015 4:54 PM

Answers

  • Hello vinc,

    >>BUT if I have more then 5 items, the ComboboxPicker shows up and it does not use the Font Segoe UI Symbol anymore. I get a rectangle shown where my Icon should have been.

    This is a by designed feature that when there are more than 5 elements, when this happens a flyout is displayed using the ListPickerFlyoutPresenter, you could find it at C:\Program Files (x86)\Windows Phone Kits\8.1\Include\abi\Xaml\Design. Since I do not think you would like to modify this xml file, you could copied this template into the application resources so that we can make changes as change its FontFamily, here is a simplified applicaiotn resource code:

    <Application
    
        x:Class="S0710RT.App"
    
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    
        xmlns:local="using:S0710RT"
    
        xmlns:controls="using:Windows.UI.Xaml.Controls" xmlns:primitives="using:Windows.UI.Xaml.Controls.Primitives">
    
        <Application.Resources>
    
            <!-- Style for a Windows.UI.Xaml.Controls.ListViewItem used in a ListPickerFlyoutPresenter -->
    
            <Style x:Key="ListPickerFlyoutPresenterItemStyle" TargetType="ListViewItem">
    
                …
    
                <Setter Property="Template">
    
                    <Setter.Value>
    
                        <ControlTemplate TargetType="ListViewItem">
    
                            <Border x:Name="OuterContainer" RenderTransformOrigin="0.5,0.5">
    
                                <VisualStateManager.VisualStateGroups>
    
                                    …
    
                                </VisualStateManager.VisualStateGroups>
    
                                <Border.RenderTransform>
    
                                    <ScaleTransform x:Name="ContentScaleTransform"/>
    
                                </Border.RenderTransform>
    
                                <Grid x:Name="ReorderHintContent" Background="Transparent">
    
                                    …
    
                                    <Border x:Name="ContentContainer">
    
                                        <Border x:Name="TiltContainer">
    
                                            <Border x:Name="ContentBorder"
    
                              Background="{TemplateBinding Background}"
    
                              BorderBrush="{TemplateBinding BorderBrush}"
    
                              BorderThickness="{TemplateBinding BorderThickness}">
    
    <Grid>
    
                                                    <ContentPresenter x:Name="contentPresenter"
    
                                            ContentTransitions="{TemplateBinding ContentTransitions}"
    
                                            ContentTemplate="{TemplateBinding ContentTemplate}"
    
                                            Content="{TemplateBinding Content}"
    
                                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
    
                                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
    
                                            Margin="{TemplateBinding Padding}"
    
                                            Style="{ThemeResource FlyoutPickerListViewItemContentPresenterStyle}"
    
                                            FontFamily="MV Boli"/>
    
                                                    <!-- The 'Xg' text simulates the amount of space one line of text will occupy.
    
                                                In the DataPlaceholder state, the Content is not loaded yet so we
    
                                                approximate the size of the item using placeholder text. -->
    
                                                    <TextBlock x:Name="PlaceholderTextBlock"
    
                                     Opacity="0"
    
                                     Text="Xg"
    
                                     Foreground="{x:Null}"
    
                                     Margin="{TemplateBinding Padding}"
    
                                     IsHitTestVisible="False"
    
                                     AutomationProperties.AccessibilityView="Raw"/>
    
                                                    <Rectangle x:Name="PlaceholderRect"
    
                                     Visibility="Collapsed"
    
                                     Fill="{ThemeResource FlyoutBackgroundThemeBrush}"
    
                                     IsHitTestVisible="False" />
    
                                                </Grid>
    
    
                                                
    
                                            </Border>
    
                                        </Border>
    
                                    </Border>
    
                                    
    
                            </Border>
    
                        </ControlTemplate>
    
                    </Setter.Value>
    
                </Setter>
    
            </Style>
    
    
            <!-- Default style for Windows.UI.Xaml.Controls.ListPickerFlyoutPresenter -->
    
            <Style TargetType="controls:ListPickerFlyoutPresenter">
    
                …
    
            </Style>
    
    
            <!-- DataTemplate holding the content for ListPickerFlyoutPresenter's ItemsHostPanel -->
    
            <DataTemplate x:Key="ListPickerFlyoutPresenterContentTemplate">
    
                …
    
            </DataTemplate>
    
    
        </Application.Resources>
    
    </Application>
    

    We copied these three sections to the application resource so that the default ListPickerFlyoutPresenter could be overridden, the result:

    The fontfamily are set to be MV Boli in ContentPresenter element.

    Regards.


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    • Marked as answer by vinc() Tuesday, July 14, 2015 4:59 PM
    Friday, July 10, 2015 1:21 PM

All replies

  • Hello vinc,

    >>BUT if I have more then 5 items, the ComboboxPicker shows up and it does not use the Font Segoe UI Symbol anymore. I get a rectangle shown where my Icon should have been.

    This is a by designed feature that when there are more than 5 elements, when this happens a flyout is displayed using the ListPickerFlyoutPresenter, you could find it at C:\Program Files (x86)\Windows Phone Kits\8.1\Include\abi\Xaml\Design. Since I do not think you would like to modify this xml file, you could copied this template into the application resources so that we can make changes as change its FontFamily, here is a simplified applicaiotn resource code:

    <Application
    
        x:Class="S0710RT.App"
    
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    
        xmlns:local="using:S0710RT"
    
        xmlns:controls="using:Windows.UI.Xaml.Controls" xmlns:primitives="using:Windows.UI.Xaml.Controls.Primitives">
    
        <Application.Resources>
    
            <!-- Style for a Windows.UI.Xaml.Controls.ListViewItem used in a ListPickerFlyoutPresenter -->
    
            <Style x:Key="ListPickerFlyoutPresenterItemStyle" TargetType="ListViewItem">
    
                …
    
                <Setter Property="Template">
    
                    <Setter.Value>
    
                        <ControlTemplate TargetType="ListViewItem">
    
                            <Border x:Name="OuterContainer" RenderTransformOrigin="0.5,0.5">
    
                                <VisualStateManager.VisualStateGroups>
    
                                    …
    
                                </VisualStateManager.VisualStateGroups>
    
                                <Border.RenderTransform>
    
                                    <ScaleTransform x:Name="ContentScaleTransform"/>
    
                                </Border.RenderTransform>
    
                                <Grid x:Name="ReorderHintContent" Background="Transparent">
    
                                    …
    
                                    <Border x:Name="ContentContainer">
    
                                        <Border x:Name="TiltContainer">
    
                                            <Border x:Name="ContentBorder"
    
                              Background="{TemplateBinding Background}"
    
                              BorderBrush="{TemplateBinding BorderBrush}"
    
                              BorderThickness="{TemplateBinding BorderThickness}">
    
    <Grid>
    
                                                    <ContentPresenter x:Name="contentPresenter"
    
                                            ContentTransitions="{TemplateBinding ContentTransitions}"
    
                                            ContentTemplate="{TemplateBinding ContentTemplate}"
    
                                            Content="{TemplateBinding Content}"
    
                                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
    
                                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
    
                                            Margin="{TemplateBinding Padding}"
    
                                            Style="{ThemeResource FlyoutPickerListViewItemContentPresenterStyle}"
    
                                            FontFamily="MV Boli"/>
    
                                                    <!-- The 'Xg' text simulates the amount of space one line of text will occupy.
    
                                                In the DataPlaceholder state, the Content is not loaded yet so we
    
                                                approximate the size of the item using placeholder text. -->
    
                                                    <TextBlock x:Name="PlaceholderTextBlock"
    
                                     Opacity="0"
    
                                     Text="Xg"
    
                                     Foreground="{x:Null}"
    
                                     Margin="{TemplateBinding Padding}"
    
                                     IsHitTestVisible="False"
    
                                     AutomationProperties.AccessibilityView="Raw"/>
    
                                                    <Rectangle x:Name="PlaceholderRect"
    
                                     Visibility="Collapsed"
    
                                     Fill="{ThemeResource FlyoutBackgroundThemeBrush}"
    
                                     IsHitTestVisible="False" />
    
                                                </Grid>
    
    
                                                
    
                                            </Border>
    
                                        </Border>
    
                                    </Border>
    
                                    
    
                            </Border>
    
                        </ControlTemplate>
    
                    </Setter.Value>
    
                </Setter>
    
            </Style>
    
    
            <!-- Default style for Windows.UI.Xaml.Controls.ListPickerFlyoutPresenter -->
    
            <Style TargetType="controls:ListPickerFlyoutPresenter">
    
                …
    
            </Style>
    
    
            <!-- DataTemplate holding the content for ListPickerFlyoutPresenter's ItemsHostPanel -->
    
            <DataTemplate x:Key="ListPickerFlyoutPresenterContentTemplate">
    
                …
    
            </DataTemplate>
    
    
        </Application.Resources>
    
    </Application>
    

    We copied these three sections to the application resource so that the default ListPickerFlyoutPresenter could be overridden, the result:

    The fontfamily are set to be MV Boli in ContentPresenter element.

    Regards.


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    • Marked as answer by vinc() Tuesday, July 14, 2015 4:59 PM
    Friday, July 10, 2015 1:21 PM
  • Thank you very much for answering to my question.

    As I need the Segoe UI Symbol Font in other Applications too, I decided to change the code-sections directly in the generic.xaml and themeresources.xaml file. I did this by defining a new Font in the beginning, where the other Fonts are set:

    <FontFamily x:Key="myExtraFont">Segoe UI Symbol</FontFamily>

    and then added or changed the default settings to

    FontFamily="{ThemeResource myExtraFont}"

    However it does not change it in the App, as it stills shows a rectangle. I'm sure that I'm using a valid character, as in a ComboBox on the same page, the one with the 5 items shows the correct Symbol in the mini-Flyout.

    Do I have to set the Font somewhere else too or import it extra? I thought Segoe UI Symbol is a System Font, but maybe I went wrong somewhere in the process here? I also cleaned the project and created it new via build option to prevent the settings are cached in some Application Folders, but still no effect.

    I even changed the global Font for Contents with no effect to

    <FontFamily x:Key="ContentControlThemeFontFamily">Segoe UI Symbol</FontFamily>

    Update:

    I followed your instructions and put the Code in the Page.Resources Section, but it does not change anything. Please note, that the position where you put FontFamily="MV Boli" is not there, but shortly after/before. My Code:

    <DataTemplate x:Key="ListPickerFlyoutPresenterContentTemplate">
        <ListView ItemContainerStyle="{StaticResource ListPickerFlyoutPresenterItemStyle}">
            <ListView.Footer>
                <Border Height="{ThemeResource ListPickerFlyoutFooterThemeHeight}" Width="1" />
            </ListView.Footer>
        </ListView>
    </DataTemplate>
    
    <Style TargetType="controls:ListPickerFlyoutPresenter">
        <Setter Property="Background" Value="{ThemeResource FlyoutBackgroundThemeBrush}" />
        <Setter Property="AutomationProperties.AutomationId" Value="ListPickerFlyoutPresenter" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="controls:ListPickerFlyoutPresenter">
                    <Border x:Name="Background"
            Background="{TemplateBinding Background}"
            BorderBrush="{TemplateBinding BorderBrush}"
            BorderThickness="{TemplateBinding BorderThickness}"
            FlowDirection="LeftToRight">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="OrientationStates">
                                <VisualState x:Name="Portrait"/>
                                <VisualState x:Name="Landscape">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPanel" Storyboard.TargetProperty="Margin">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource PickerFlyoutContentPanelLandscapeThemeMargin}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid x:Name="ContentPanel"
            Margin="{ThemeResource PickerFlyoutContentPanelPortraitThemeMargin}"
            FlowDirection="{TemplateBinding FlowDirection}">
                            <Grid.RenderTransform>
                                <TranslateTransform x:Name="ContentPanelTransform"/>
                            </Grid.RenderTransform>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>
                            <TextBlock x:Name="TitlePresenter"
                    Grid.Row="0" Margin="{ThemeResource PickerFlyoutTitleThemeMargin}"
                    Style="{StaticResource FlyoutPickerTitleTextBlockStyle}"
                    AutomationProperties.AccessibilityView="Raw"
    				FontFamily="Segoe UI Symbol"/>
                            <Grid x:Name="ItemsHostPanel"
            Grid.Row="1"
            Margin="{ThemeResource FlyoutContentThemeMargin}"
            HorizontalAlignment="Stretch"
            VerticalAlignment="Top">
                            </Grid>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    
    <Style x:Key="ListPickerFlyoutPresenterItemStyle" TargetType="ListViewItem">
        <Setter Property="FontFamily" Value="Segoe UI Symbol" />
        <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="TabNavigation" Value="Local" />
        <Setter Property="IsHoldingEnabled" Value="False" />
        <Setter Property="Margin" Value="{ThemeResource ListPickerFlyoutPresenterItemMargin}" />
        <Setter Property="HorizontalContentAlignment" Value="Left" />
        <Setter Property="VerticalContentAlignment" Value="Top" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListViewItem">
                    <Border x:Name="OuterContainer" RenderTransformOrigin="0.5,0.5">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <PointerDownThemeAnimation Storyboard.TargetName="TiltContainer" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="CheckboxPressed">
                                    <Storyboard>
                                        <PointerDownThemeAnimation Storyboard.TargetName="CheckboxTiltContainer" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetName="contentPresenter" Storyboard.TargetProperty="Opacity" Duration="0"
                                To="{ThemeResource ListViewItemDisabledThemeOpacity}" />
                                    </Storyboard>
                                </VisualState>
                                <VisualStateGroup.Transitions>
                                    <VisualTransition From="Pressed" To="Normal">
                                        <Storyboard>
                                            <PointerUpThemeAnimation Storyboard.TargetName="TiltContainer" />
                                        </Storyboard>
                                    </VisualTransition>
                                </VisualStateGroup.Transitions>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="SelectionStates">
                                <VisualState x:Name="Unselected" />
                                <VisualState x:Name="Selected">
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetName="CheckGlyph" Storyboard.TargetProperty="Opacity" Duration="0" To="1" />
                                        <DoubleAnimation Storyboard.TargetName="SelectedCheckMark" Storyboard.TargetProperty="Opacity" Duration="0" To="1" />
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="contentPresenter" Storyboard.TargetProperty="Foreground" Duration="0">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListPickerFlyoutPresenterSelectedItemForegroundThemeBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentBorder" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListPickerFlyoutPresenterSelectedItemBackgroundThemeBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="SelectedUnfocused">
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetName="CheckGlyph" Storyboard.TargetProperty="Opacity" Duration="0" To="1" />
                                        <DoubleAnimation Storyboard.TargetName="SelectedCheckMark" Storyboard.TargetProperty="Opacity" Duration="0" To="1" />
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="DataVirtualizationStates">
                                <VisualState x:Name="DataAvailable" />
                                <VisualState x:Name="DataPlaceholder">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextBlock" Storyboard.TargetProperty="Visibility" Duration="0">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderRect" Storyboard.TargetProperty="Visibility" Duration="0">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="MultiSelectStates">
                                <VisualState x:Name="NoMultiSelect" />
                                <VisualState x:Name="ListMultiSelect">
                                    <Storyboard>
                                        <DoubleAnimation To="0" Duration="0" Storyboard.TargetName="CheckboxContainerTranslateTransform" Storyboard.TargetProperty="X" />
                                        <DoubleAnimation To="25.5" Duration="0" Storyboard.TargetName="ContentBorderTranslateTransform" Storyboard.TargetProperty="X" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="GridMultiSelect" />
                                <VisualStateGroup.Transitions>
                                    <VisualTransition From="ListMultiSelect" To="NoMultiSelect" GeneratedDuration="0:0:0.15" />
                                    <VisualTransition From="NoMultiSelect" To="ListMultiSelect" GeneratedDuration="0:0:0.15" />
                                </VisualStateGroup.Transitions>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="HighlightStates">
                                <VisualState x:Name="NoHighlight" />
                                <VisualState x:Name="Highlighted">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="contentPresenter" Storyboard.TargetProperty="Foreground" Duration="0">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListPickerFlyoutPresenterSelectedItemForegroundThemeBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentBorder" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListPickerFlyoutPresenterSelectedItemBackgroundThemeBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Border.RenderTransform>
                            <ScaleTransform x:Name="ContentScaleTransform"/>
                        </Border.RenderTransform>
                        <Grid x:Name="ReorderHintContent" Background="Transparent">
                            <Border x:Name="CheckboxTiltContainer"
                HorizontalAlignment="Left"
                VerticalAlignment="Top"
                Margin="{ThemeResource ListPickerFlyoutPresenterMultiselectCheckBoxMargin}">
                                <Border x:Name="CheckboxOuterContainer">
                                    <Border.Clip>
                                        <RectangleGeometry Rect="0,0,25.5,25.5" />
                                    </Border.Clip>
                                    <Grid x:Name="CheckboxContainer">
                                        <Grid.RenderTransform>
                                            <TranslateTransform x:Name="CheckboxContainerTranslateTransform" X="{ThemeResource ListViewItemContentOffsetX}" />
                                        </Grid.RenderTransform>
                                        <Rectangle x:Name="NormalRectangle"
                        Fill="{ThemeResource CheckBoxBackgroundThemeBrush}"
                        Stroke="{ThemeResource CheckBoxBorderThemeBrush}"
                        StrokeThickness="{ThemeResource CheckBoxBorderThemeThickness}"
                        Height="25.5"
                        Width="25.5"/>
                                        <Path x:Name="CheckGlyph"
                    IsHitTestVisible="False"
                    Width="18.5"
                    Height="17"
                    Stretch="Fill"
                    Opacity="0"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Fill="{ThemeResource CheckBoxForegroundThemeBrush}"
                    Data="M0,123 L39,93 L124,164 L256,18 L295,49 L124,240 z"
                    StrokeLineJoin="Round"
                    StrokeThickness="2.5"
                    FlowDirection="LeftToRight" />
                                    </Grid>
                                </Border>
                            </Border>
                            <Border x:Name="ContentContainer">
                                <Border x:Name="TiltContainer">
                                    <Border x:Name="ContentBorder"
                    Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}">
                                        <Border.RenderTransform>
                                            <TranslateTransform x:Name="ContentBorderTranslateTransform" />
                                        </Border.RenderTransform>
                                        <Grid>
                                            <ContentPresenter x:Name="contentPresenter"
                                ContentTransitions="{TemplateBinding ContentTransitions}"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                Content="{TemplateBinding Content}"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                Margin="{TemplateBinding Padding}"
                                Style="{ThemeResource FlyoutPickerListViewItemContentPresenterStyle}"/>
                                            <!-- The 'Xg' text simulates the amount of space one line of text will occupy.
                                    In the DataPlaceholder state, the Content is not loaded yet so we
                                    approximate the size of the item using placeholder text. -->
                                            <TextBlock x:Name="PlaceholderTextBlock"
                            Opacity="0"
                            Text="Xg"
                            Foreground="{x:Null}"
                            Margin="{TemplateBinding Padding}"
                            IsHitTestVisible="False"
                            AutomationProperties.AccessibilityView="Raw"/>
                <Rectangle x:Name="PlaceholderRect"
                            Visibility="Collapsed"
                            Fill="{ThemeResource FlyoutBackgroundThemeBrush}"
                            IsHitTestVisible="False" />
            </Grid>
                                    </Border>
                                </Border>
                            </Border>
                            <Border x:Name="SelectedBorder"
                IsHitTestVisible="False"
                Opacity="0"
                BorderBrush="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}"
                BorderThickness="{ThemeResource GridViewItemMultiselectBorderThickness}">
                                <Grid x:Name="SelectedCheckMark"
                Opacity="0"
                Height="34"
                Width="34"
                HorizontalAlignment="Right"
                VerticalAlignment="Top">
                                    <Path x:Name="SelectedEarmark" Data="M0,0 L40,0 L40,40 z"
                Fill="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}"
                Stretch="Fill" />
                                    <Path x:Name="SelectedGlyph"
                Data="M0,123 L39,93 L124,164 L256,18 L295,49 L124,240 z"
                Fill="{ThemeResource ListViewItemCheckThemeBrush}"
                Height="14.5"
                Stretch="Fill"
                Width="17"
                HorizontalAlignment="Right"
                Margin="0,1,1,0"
                VerticalAlignment="Top"
                FlowDirection="LeftToRight" />
                                </Grid>
                            </Border>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    Do you have some tips for me?



    • Edited by vinc() Saturday, July 11, 2015 6:23 PM Update
    Saturday, July 11, 2015 5:45 PM
  • Hello vinc,

    >>As I need the Segoe UI Symbol Font in other Applications too, I decided to change the code-sections directly in the generic.xaml and themeresources.xaml file.

    I do not recommend to modify these system files.

    >>Do I have to set the Font somewhere else too or import it extra?

    I suggest you could first check if your running machine has installed the Segoe UI Symbol font, you could search this online by using your favorite research tool, it should give many results.

    >>I followed your instructions and put the Code in the Page.Resources Section,

    Please place it to the application resource, because the ComboboxPicker is actually in a separate page.

    >>Please note, that the position where you put FontFamily="MV Boli" is not there, but shortly after/before

    Please set the font to what you want in the ContentPresenter element, this element represents the actual item content font.

    Regards.


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Monday, July 13, 2015 2:14 PM
  • Hello @Fred Bao,

    The trick was the Application.Resource part. When I put it in the Page.Resource file with the ComboBox it wouldn't work, as you mentioned, because it's not on the same page.

    The strange, when I put the code into Page.Resource, it gave me an Error, where you put FontFamily="MV Boli". Now the compiler does not complain about it anymore.

    Nevertheless - thank you very much!! It works like charm now. And thank you very much again for putting up with my narrow-minded actions and explaining why they were wrong :)

    Tuesday, July 14, 2015 4:59 PM