Support of XamlHost / XamlIslands

[evilbaschdi]

trafficstars

I played around with XamlHost a little bit. The difference between "normal" WPF or UWP code ist that it's only possible to define the WindowsXamlHost it self and an "InitialTypeName" to be "Windows.UI.Xaml.Controls.Button" inside the xaml. All other stuff has to be done in the code behind - what is not so nice.

So I usually have had an icon next to my button caption as a content. So I added a StackPanel to the button and hostet an icon and a TextBlock inside the StackPanel. Now with the current state of implementation of XamlIslands I have to do that all manually.

• Cast the Control to Button => done
• Add a StackPanel to it => done
• Add a TextBlock to it => done
• Add an icon to it ... That is where my problem begins I already tried to host the PackIcon inside the Windows.UI.Xaml.Controls.StackPanel that ends up an some casting errors. Lastly I added a new Image, set Binding.Source to my PackIcon and failed while setting the bindings converter to PackIconMaterialKindToImageConverter.

So do you have plans or already working code examples on how to host IconPacks inside Windows.UI.Xaml.Controls?

[timunie]

Hi @evilbaschdi

Can you provide a Demo App on github? That way we can have a look and maybe find a solution.

Thank you in advance

Happy coding Tim

[evilbaschdi]

https://github.com/evilbaschdi/FolderArchiver/blob/feature/xamlhost/FolderArchiver/MainWindow.xaml.cs

Method "BrowseChildChanged"

[timunie]

Hi @evilbaschdi I found a solution, at least a workaround.

// 1. We get the PathData as string which should be renderd
string pathData = new PackIconMaterial() { Kind = PackIconMaterialKind.CubeOutline }.Data;

// 2. We create the UWP Path which is needed to render
Geometry geometry = (Geometry)XamlBindingHelper.ConvertValue(typeof(Geometry), pathData);

// 3. Create the PathIcon and set the Foreground
System.Windows.Media.Color accentColor = (System.Windows.Media.Color)FindResource("MahApps.Colors.Accent");
PathIcon pathIcon = new PathIcon()
{
    Data = geometry,
    Foreground = new SolidColorBrush(Color.FromArgb(accentColor.A, accentColor.R, accentColor.G, accentColor.B))
};

// 4. Add it to your Panel
stackPanel.Children.Add(pathIcon);

The result:

I hope this helps. Happy coding Tim