C#•2mo ago

Controls from WPF.UI can't render properly on WPF, .NET Framework 4.8

I did it exactly like the guide, but still can't render it. And no, this is not from the design view, this is from the built exe. The same with other elements, <ui:Button/> will result in a 0 width button.

12 Replies

Bailey•2mo ago

Hi, an issue like this is very difficult to analyse when you dont have the complete code. That said, maybe you can use the following: 99% o the time when having issues like this (and it does not matter which language / framework etc) it the cause of: - Not able to map the font - Resources missing (not added to the sollution). - Typo with the resource. So it could be as simple as that the resource must be included (or set on copy always in the sollution). Hope this helps

kianyuen•2mo ago

I mean, it's a NuGet package, the thing is I referenced it all the way from App.xaml to UserControl, the only place there can even be code within my control is this xaml (aside from my screenshot):

<UserControl x:Class="MVVM_ScreenFlow.Views.Modules.BloodPressureView"
             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:gif="https://github.com/XamlAnimatedGif/XamlAnimatedGif"

             xmlns:local="clr-namespace:MVVM_ScreenFlow.Views.Modules"
             mc:Ignorable="d" 
             d:DesignHeight="700" d:DesignWidth="1280">

<UserControl x:Class="MVVM_ScreenFlow.Views.Modules.BloodPressureView"
             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:gif="https://github.com/XamlAnimatedGif/XamlAnimatedGif"

             xmlns:local="clr-namespace:MVVM_ScreenFlow.Views.Modules"
             mc:Ignorable="d" 
             d:DesignHeight="700" d:DesignWidth="1280">

Buddy•2mo ago

Read getting started https://wpfui.lepo.co/documentation/getting-started.html

wpfui.lepo.co

kianyuen•2mo ago

yeah that's what I meant by following the guide. the IDE doesn't detect anything abnormal either. My App.xaml:

<Application x:Class="MVVM_ScreenFlow.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:MVVM_ScreenFlow"
             xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"
>
    <Application.Resources>
        <FontFamily x:Key="Montserrat">pack://application:,,,/Fonts/#Montserrat</FontFamily>
        <LinearGradientBrush x:Key="GradientBrush" StartPoint="0,1" EndPoint="1,0">
            <GradientStop Color="#3A8EF6" Offset="0" />
            <GradientStop Color="#6F3AFA" Offset="1"/>
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="PressedGradientBrush" StartPoint="0,1" EndPoint="1,0">
            <GradientStop Color="#3A8EF6" Offset="0"/>
            <GradientStop Color="#804CFF" Offset="1"/>
        </LinearGradientBrush>
        <ResourceDictionary x:Key="menuStyles">
            <ResourceDictionary.MergedDictionaries>
                <ui:ThemesDictionary Theme="Light" />
                <ui:ControlsDictionary />
                <ResourceDictionary Source="Styles/ButtonStyles.xaml"/>
                <ResourceDictionary Source="Styles/HeadingStyles.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

<Application x:Class="MVVM_ScreenFlow.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:MVVM_ScreenFlow"
             xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"
>
    <Application.Resources>
        <FontFamily x:Key="Montserrat">pack://application:,,,/Fonts/#Montserrat</FontFamily>
        <LinearGradientBrush x:Key="GradientBrush" StartPoint="0,1" EndPoint="1,0">
            <GradientStop Color="#3A8EF6" Offset="0" />
            <GradientStop Color="#6F3AFA" Offset="1"/>
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="PressedGradientBrush" StartPoint="0,1" EndPoint="1,0">
            <GradientStop Color="#3A8EF6" Offset="0"/>
            <GradientStop Color="#804CFF" Offset="1"/>
        </LinearGradientBrush>
        <ResourceDictionary x:Key="menuStyles">
            <ResourceDictionary.MergedDictionaries>
                <ui:ThemesDictionary Theme="Light" />
                <ui:ControlsDictionary />
                <ResourceDictionary Source="Styles/ButtonStyles.xaml"/>
                <ResourceDictionary Source="Styles/HeadingStyles.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

i was messing around so it's a bit messy

Buddy•2mo ago

SymbolIcon seems to require a certain font Because it is a text element

kianyuen•2mo ago

Is that font missing from my System?

Buddy•2mo ago

Or in your app. Are you overriding the font in your app?

kianyuen•2mo ago

I'm not sure how to check it, I only added Montserrat. and I think it didn't work even before I added it. I'm just stumbling on customizing controls so I have to revisit it again.

Buddy•2mo ago

You might need to override the font property for the SymbolIcon control To a glyph font Like Segoe Fluent Icons

kianyuen•2mo ago

Yeah, but what about other controls, like Button. it doesn't have anything

Buddy•2mo ago

Use FontIcon to specify an icon using a Glyph value from a FontFamily

Use SymbolIcon specify an icon using a Glyph value from a Symbol enumeration

Someome mentioned this on Github Issues

kianyuen•2mo ago

Like ToggleSwitch and Button are just tiny gray square:

Gaming

Programming

Controls from WPF.UI can't render properly on WPF, .NET Framework 4.8