We Keep Coding

Cannot reference to an external assembly in KAXAML

I am absolutely new to WPF and trying to create some sample UIs in KAXAML. I need to have some emojis in the buttons therefore, I installed the emoji.wpf nuget package. By doing that, I am able to reference the emoji.wpf assembly in a Visual Studio project but if I try to refence the same assembly in a KAXAML file, it does not work.
As per this SO answer's suggestion, I have already copied the emoji.wpf.dll into the KAXAML folder (C:\Program Files (x86)\Kaxaml)
My Sample Code:
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:emoji="clr-namespace:Emoji.Wpf;assembly=Emoji.Wpf">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Button Grid.Row="0">
<StackPanel Orientation="Horizontal">
<emoji:TextBlock Text="🔴"/>
<Label>MyLabel</Label>
</StackPanel>
</Button>
</Grid>
</Page>
Error in KAXAML
'Cannot create unknown type '{clr-namespace:Emoji.Wpf;assembly=emoji.Wpf}TextBlock'.'

Coded UI Test Generator has trouble correctly recording actions on a ListViewItem

I'm currently working on making an application CUIT-Generator ready. That means that, as an example, I'm adding XAML setters to the styles for DataGridRow that set Automation.ID and AutomationName. Works just fine.
Now my issue is that there is a ListView where the ItemTemplate contains a DataTemplate which in turn has a custom UI control.
When recording any action on the text controls inside the custom UI control, it only grabs the custom UI control and the hierarchy below it, but it doesn't record that it is inside a ListView and a ListViewItem.
Due to this, the control can not be found during test execution or when selecting the control in the UIMap and clicking Search UI control.
I tried setting the AutomationID/Name on the ListViewItem and the ListView but that does not have an impact on the recorded hierarchy.
XAML code for the ListView:
<ListView x:Name="sampleControl" Margin="3" ItemsSource="{Binding ObservableCollectionOfViewModelItems}">
<ListView.ItemContainerStyle>
<Style TargetType="{x:Type ListViewItem}">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="AutomationProperties.Name">
<Setter.Value>
<Binding Path="AutoID"/>
</Setter.Value>
</Setter>
<Setter Property="AutomationProperties.AutomationId">
<Setter.Value>
<Binding Path="AutoID"/>
</Setter.Value>
</Setter>
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate>
<SampleNamespace:CustomUIControlView />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Code for the CustomUIControlView:
<UserControl x:Class="SampleNamespace.CustomUIControlView"
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">
<Border BorderThickness="3">
<Expander>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<TextBox Grid.Column="1" Grid.Row="0" Name="SampleBox1" Height="20" Margin="5" Text="{Binding SampleProp1, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<TextBox Grid.Column="1" Grid.Row="1" Name="SampleBox2" Height="20" Margin="5" Text="{Binding SampleProp2, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<TextBox Grid.Column="1" Grid.Row="2" Name="SampleBox3" Height="20" Margin="5" Text="{Binding SampleProp3, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<TextBox Grid.Column="1" Grid.Row="3" Grid.ColumnSpan="7" Name="SampleBox4" Height="20" Margin="5" Text="{Binding SampleProp4, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
</Grid>
</Expander>
</Border>
</UserControl>
The recorded hierarchy for an action recorded on SampleBox1 looks like this:
SampleAppWindow
---- CustomUIControlView
-------- Expander
------------ SampleBox1/TextBox
Obviously none of the controls, aside from the Window are going to be found.
I know that I could transfer the recorded actions to C# code and then edit the hierarchy and search properties myself but I would like to avoid doing this as I would have to remember doing that every time a ListView is involved in a recorded test.
I'm mentioning this as most solutions here on SO or on other websites come down to working around the problem like that.
This is on Visual Studio 2017 15.3.5 and .NET Framework 4.5.2.

I'm fairly certain you are asking for something beyond what the CodedUi Code Generator can handle.
I would point out from the generated object structure it missed entirely the ListView. The route I would recommend is first being sure you can locate the ListView, generated or your own code, probably call DrawHighlight to be sure. I get your trying to avoid your own code for defining object definitions but it is probably only feasible to write your own.
Now specifically for your CustomUIControlView, I would urge you to define a matching CodedUI object that matches it. As is, an Expander with 4 children TextBoxes. This would cut down coding this definition several times. If you look at the generated code as examples to write these.
Depending on your view on designer files, you could also declare the immediately expected parent node of your ListView or itself as a partial class to hook in these unmatched children elements in a separate file to avoid it getting wiped by the generator. Then you would only need to update the designer file with the small partial statement edits.

UIRoot does not exist in the clr-namespace?

I am using an external library which generates an class for UI in my game from XAML, everything generates fine and it's working as intended except for one part. It says the Root element does not exist in the namespace and thus I cannot use the designer, the creator of the library himself doesn't even know why it is doing this, it works fine for him.
<!--ek:UIRoot was not found/ does not exist in the namespace-->
<ek:UIRoot
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:ek="clr-namespace:EmptyKeys.UserInterface.Designer;assembly=EmptyKeys.UserInterface.Designer"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<TextBlock Text="Hello World" Grid.Row="0" />
<TextBlock Text="This is EmptyKeys In monogame" Grid.Row="1" />
</Grid>
</ek:UIRoot>
And yet it does
The project is .net4.5 and anycpu the same as what the library is built on and i've rebuild the solution many times. (those were the solutions to similar issues)
Am I missing something?

I needed to unblock the dll because it came from another computer
http://blogs.msdn.com/b/delay/p/unblockingdownloadedfile.aspx
the example is a zip but it applies the same for dlls

Apply MahApps.Metro theme and accent to other controls or rectangles

I'm trying to put a status bar on the bottom of my window that uses the same color scheme as the title bar. I know the piece I'm missing is style inheritance and/or template setting, but I've been reading for hours and I can't figure it out.
Here's how my window currently looks:
Here's how it looks in the designer:
What I want:
A status bar at the bottom of the window that mirrors the style of the titlebar. I recognize that my current implementation is probably less than great, so I'm also open to changing my statusbar defintiion as seen below. I tried to use an actual statusbar, but it wouldn't behave the way I wanted (the textboxes wouldn't fill the empty space, so the command line input textbox was very hard to click - maybe I was just doing something wrong). I'm assuming I can also apply the style to a rectangle just like anything else, right? I'm missing a critical component with the style property and probably the user of a template or a staticresource, but I'm totally lost.
Here's my current solution (a label and two textboxes for status updates and a cmdline):
<Grid Grid.Row="1">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.5*"/>
<ColumnDefinition Width="0.5*"/>
</Grid.ColumnDefinitions>
<Label Grid.Column="0"/>
<Grid Grid.Column="1">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBox Grid.Row="0" Grid.Column="0"/>
<TextBox Grid.Row="0" Grid.Column="1"/>
</Grid>
</Grid>

I solved this by using the AccentColorBrush resource in my status bar grid.
<Grid Grid.Row="1" Background="{DynamicResource AccentColorBrush}">
I found it by inspecting many XAML files in MahApps.Metro on GitHub. This may seem obvious to some people, but for someone who is trying to learn XAML/WPF/MVVM, this wasn't straight forward. I hope this helps someone as I struggled with it for quite a while.

XamlParseException while assigning to property

This problem was originally posted here. Though the OP accepted solution, I still cannot figure out what caused the exception. I've made some further tests and failed.
The code is very simple - Windows Phone App only with xaml content:
<phone:PhoneApplicationPage.Resources>
<Image x:Key="IButton" Source="Resources/firstImage.png"/>
</phone:PhoneApplicationPage.Resources>
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="1*"/>
<RowDefinition Height="1*"/>
</Grid.RowDefinitions>
<Button x:Name="first" Content="{StaticResource IButton}" VerticalAlignment="Center" Grid.Row="0"/>
<Button x:Name="second" VerticalAlignment="Center" Grid.Row="1">
<Image Source="Resources/firstImage.png"/>
</Button>
</Grid>
At the first glance, everything looks ok, VS designer shows properly two Buttons with images inside. When I try to deply the App I get the XamlParseException:
Failed to assign to property 'System.Windows.Controls.ContentControl.Content'.
The problem concerns first button - second is running without problem
Quite strange. I've tried changing Build Action (Resource/Content), cleaning project, without success.
Contrary, very similar WPF application works without issue. You just hit Run and see two buttons:
<Window.Resources>
<Image x:Key="IButton" Source="Resources/firstImage.png"/>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="1*"/>
<RowDefinition Height="1*"/>
</Grid.RowDefinitions>
<Button x:Name="first" Content="{StaticResource IButton}" VerticalAlignment="Center" Grid.Row="0"/>
<Button x:Name="second" VerticalAlignment="Center" Grid.Row="1">
<Image Source="Resources/firstImage.png"/>
</Button>
</Grid>
Has anybody an idea what can be wrong? Both applications (WP/WPF) you can get here.

May be this is the difference
<Button x:Name="second" VerticalAlignment="Center" Grid.Row="1">
<Button.Content>
<Image Source="Resources/firstImage.png"/>
</Button.Content>
</Button>
A Button.Content Tag is extra here .
Also the build action of the image should be set to content here.
This is working in my case atleast.