I'm building an app in which I have created a UserControlthat has a second UserControl inside of it.
Here is the first UserControl:
<UserControl x:Class="TasksMonitor.CustomControls.TaskCardBtn"
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:local="clr-namespace:TasksMonitor.CustomControls"
mc:Ignorable="d"
Name="TaskCardBtnCustomControl"
d:DesignHeight="300" d:DesignWidth="300">
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="../CustomButtonsStyles.xaml" />
</ResourceDictionary.MergedDictionaries>
<Style TargetType="ToolTip"></Style>
</ResourceDictionary>
</UserControl.Resources>
<Button Click="OnButtonClick" Style="{DynamicResource FlatCntrlBtn}">
<Grid Width="{Binding ActualWidth, ElementName=TaskCardBtnCustomControl}" VerticalAlignment="Center" HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1"/>
<ColumnDefinition Width="15"/>
<ColumnDefinition Width="10"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="35"/>
</Grid.RowDefinitions>
<Canvas Margin="4,10,0,0" Grid.Column="1">
<Ellipse Width="15" Height="15" Fill="{Binding Path=StatusColor, ElementName=TaskCardBtnCustomControl, FallbackValue=#FFFFFF}"/>
</Canvas>
<TextBlock VerticalAlignment="Center" x:Name="BtnTitle" Grid.Column="3" Text="{Binding Path=BtnText, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"/>
</Grid>
</Button>
</UserControl>
That UserControl is inside of this UserControl:
<UserControl x:Class="TasksMonitor.CustomControls.TaskCardUserControl"
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:local="clr-namespace:TasksMonitor"
xmlns:ut="clr-namespace:TasksMonitor.Utils"
xmlns:cc="clr-namespace:TasksMonitor.CustomControls"
Name="TaskCardUC"
mc:Ignorable="d"
Margin="5"
d:DesignHeight="35" d:DesignWidth="300">
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary x:Name="Icons" Source="../Resources/Icons.xaml" />
</ResourceDictionary.MergedDictionaries>
<ut:StatusToColorConverter x:Key="StatusToColor"/>
</ResourceDictionary>
</UserControl.Resources>
<Grid Width="auto">
<Grid Background="#2B2B2B">
<Grid.RowDefinitions>
<RowDefinition Height="35"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<cc:TaskCardBtn StatusColor="{Binding TskStatus, Converter={StaticResource StatusToColor}}" BtnText="{Binding Path=StuffYeah, ElementName=TaskCardUC}" x:Name="ExpandCollapseBtn" BtnClick="GridContentControl_Expand"/>
</Grid>
<Grid Grid.Row="1" Background="#2B2B2B" Name="GridContent" >
<UserControl Margin="10" Loaded="GridContentControl_Loaded">
</UserControl>
</Grid>
</Grid>
</Grid>
</UserControl>
The second UserControl or Parent UserControl is being used in a DataTemplate:
<Grid.Resources>
<DataTemplate x:Key="itemTemplate">
<cc:TaskCardUserControl StuffYeah="{Binding BtnTxt}"/>
</DataTemplate>
</Grid.Resources>
When I set the Bind to BtnTxt as illustrated in the DataTemplate above it does not work and says that it can't find 'BtnTxt' in object TaskCardUserControl. I feel that this is a binding issue as I have a property from the first UserControl bound to the parent property and then that parent property bound to the DataTemplate. I'm very new to DataTemplates and UserControl in general, would someone be able to point me in the correct direction?
Thanks in advance.
I figured this out...I was setting this.DataContext = this in the code which was actually old code. Once I commented this out everything works as it should. Thanks for the help.
Related
Current custom window(base) is:
<Window x:Class="Views.DialogWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Views"
xmlns:dialog="clr-namespace:ViewModels"
mc:Ignorable="d"
Title="DialogWindow" Height="450" Width="800" WindowStartupLocation="CenterScreen" WindowStyle="None" AllowsTransparency="True" Background="Transparent" ResizeMode="CanResizeWithGrip" SizeToContent="WidthAndHeight">
<Window.Resources>
<ResourceDictionary>
<DataTemplate DataType="{x:Type dialog:Dialog_1ViewModel}">
<local:Dialog_1></local:Dialog_1>
</DataTemplate>
</ResourceDictionary>
</Window.Resources>
<ContentPresenter x:Name="ContentPresenter" Content="{Binding}"></ContentPresenter>
</Window>
Window in designer:
Its DataContext is set to an instance of UserControl:
<UserControl x:Class="Views.Dialog_1"
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:local="clr-namespace:Views"
xmlns:t1="clr-namespace:Windows"
mc:Ignorable="d" d:DesignHeight="400" d:DesignWidth="600">
<UserControl.Resources>
<ResourceDictionary>
<Style TargetType="TextBlock">
<Setter Property="TextTrimming" Value="CharacterEllipsis"></Setter>
</Style>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/Resources/Resource_1.xaml"></ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
<Border CornerRadius="4" Background="#ffff" BorderThickness="1" BorderBrush="#9888">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="2*"></RowDefinition>
<RowDefinition Height="12*"/>
<RowDefinition Height="15*"></RowDefinition>
<RowDefinition Height="40"></RowDefinition>
</Grid.RowDefinitions>
<Border Grid.Row="0" BorderThickness="0,0,0,1" BorderBrush="#f999" Cursor="Hand" MouseDown="Border_MouseDown">
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="Header"></TextBlock>
</Border>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*" MinWidth="150"></ColumnDefinition>
<ColumnDefinition Width="3*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0" Margin="4">
<Image Source="C:\test.png"></Image>
</Grid>
<Grid Grid.Column="1" Margin="4">
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition Height="20"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0">
<DockPanel>
<TextBlock Text="Foo: " FontWeight="Bold" Margin="0,0,4,0"></TextBlock>
<TextBlock Text="Bar"></TextBlock>
</DockPanel>
<DockPanel Margin="0,8,0,0">
<TextBlock Text="Foo: " FontWeight="Bold" Margin="0,0,4,0"></TextBlock>
<TextBlock Text="Bar"></TextBlock>
</DockPanel>
<DockPanel>
<TextBlock Text="Foo: " FontWeight="Bold" Margin="0,0,4,0"></TextBlock>
<TextBlock Text="Bar"></TextBlock>
</DockPanel>
<DockPanel>
<TextBlock Text="Foo: " FontWeight="Bold" Margin="0,0,4,0"></TextBlock>
<TextBlock Text="Bar"></TextBlock>
</DockPanel>
</StackPanel>
<DockPanel Grid.Row="1" VerticalAlignment="Center">
<TextBlock Text="Foo: " FontWeight="Bold" Margin="0,0,4,0"/>
<TextBlock Text="Bar"/>
</DockPanel>
</Grid>
</Grid>
<DataGrid Grid.Row="2" Background="#ff88" ColumnWidth="Auto" VerticalAlignment="Stretch" AutoGenerateColumns="False" ItemsSource="{Binding data_1}">
<DataGridTextColumn Header="Name" MinWidth="200" Binding="{Binding Name}"/>
<DataGridTextColumn Header="Description" MinWidth="100" Binding="{Binding Description}"/>
</DataGrid>
<Border Grid.Row="3" BorderThickness="0,1,0,0" BorderBrush="#f999">
<Grid HorizontalAlignment="Right" Margin="4">
<Button Style="{StaticResource T_button_1}" HorizontalAlignment="Right" VerticalAlignment="Center" Width="100" Command="{Binding C_No}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=Window}}" t1:Button_1.Icon="/Icons/no.png" t1:Button_1.Label="Cancel"/>
<Button Style="{StaticResource T_button_1}" HorizontalAlignment="Right" VerticalAlignment="Center" Width="100" Command="{Binding C_Yes}" CommandParameter="{Binding RelativeSource={RelativeSource AncestorType=Window}}" Margin="0,0,105,0"/>
</Grid>
</Border>
</Grid>
</Border>
</UserControl>
UserControl in designer:
The result(run and resize process):
Close look shows interesting behaviour(seems like style changes):
Edit 1
Made some more minimized version:
<UserControl x:Class="Views.Dialog_1"
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="400" d:DesignWidth="600">
<UserControl.Resources>
<ResourceDictionary>
<Style TargetType="TextBlock">
<Setter Property="TextTrimming" Value="CharacterEllipsis"></Setter>
</Style>
<Style TargetType="Grid">
<Setter Property="ShowGridLines" Value="True"></Setter>
</Style>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/Resources/Resource_1.xaml"></ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
<Border Background="#ffff" BorderThickness="1" BorderBrush="#ccc">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="20"></RowDefinition>
<RowDefinition Height="2*"/>
<RowDefinition Height="3*"></RowDefinition>
<RowDefinition Height="40"></RowDefinition>
</Grid.RowDefinitions>
<Border Grid.Row="0">
</Border>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="3*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0" Margin="4">
<Image Source="C:\test.ico"></Image>
</Grid>
<Grid Grid.Column="1" Margin="4">
</Grid>
</Grid>
<Grid Grid.Row="2">
</Grid>
<Border Grid.Row="3">
</Border>
</Grid>
</Border>
</UserControl>
When run:
What could cause such issue where controls' initial sizes are oddly wrong and after resizing they return to "normal" or how would it be possible to fix/escape that situation leaving similar logic with custom UserControl of Window?
May this be caused by ContentPresenter part?
I am having trouble getting a ScrollViewer to work properly if it's not the only element in the window. I want to scroll through a list of items(a list set as ItemsSource) but also want other elements to be visible in my window. Now i don't know how to set the height relative to the other elements. Is that even a valid approach or am i doing it completly wrong?
<Window x:Class="FactorioWpf.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:FactorioWpf"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525"
Closing="Window_Closing">
<StackPanel>
<Menu>
<MenuItem Header="Items">
<MenuItem Header="Add" Click="ItemsAdd_Click" />
</MenuItem>
</Menu>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<ScrollViewer Grid.Column="0">
<ItemsControl Name="ItemViewerItemsControl">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
</Grid>
</StackPanel>
I searched for nearly three hours but the only solutions i could find, were to set the scroll viewer as the top element.
It is not gonna work with StackPanel. StackPanel grows based on content. Actually it will work with stack panel but you need to define height of ScrollViewer. Use grid with row definitions.
<Window x:Class="WpfApplication3.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApplication3"
mc:Ignorable="d" Height="350" Width="525" >
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Menu Grid.Row="0">
<MenuItem Header="Items">
<MenuItem Header="Add" Click="MenuItem_OnClick" />
</MenuItem>
</Menu>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<ScrollViewer VerticalScrollBarVisibility="Auto" Grid.Column="0">
<ItemsControl Name="ItemViewerItemsControl">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
</Grid>
</Grid>
</Window>
I created with Material Design a UserControl Button, based on the method behind I would like to reuse the template with change of the icon. I tried to add the materialdesign:Packicon into the UserControl.Resources, but seems wrong. The Attribute Style is already in use. How can I achieve my icon change?
<UserControl x:Class="MaterialDesignTest1.UserControl2"
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:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
mc:Ignorable="d" d:DesignWidth="300" Height="132">
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Button.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
<Grid>
<Grid Height="132" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!-- Header -->
<Button Grid.Row="0" Grid.Column="0" Background="WhiteSmoke" BorderBrush="LightGray" Style="{StaticResource MaterialDesignFloatingActionMiniAccentButton}"
HorizontalAlignment="Center" VerticalAlignment="Center" Margin="1,1,1,1" Width="50" Height="50">
<materialDesign:PackIcon Height="30" Width="30" Kind="BluetoothConnect" />
</Button>
</Grid>
in code behind, create a new packicon, set the content of the button like below:
PackIcon packIcon = new PackIcon();
packIcon.Kind = PackIconKind.FullscreenExit;
btnResizeDashboard.Content = packIcon;
I need to place a custom UserControl into a Stackpannel.
I have this UserControl:
<UserControl
x:Class="ScannerApp.Custom_Controls.LocationAndQuantity"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ScannerApp.Custom_Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="20"
d:DesignWidth="400">
<Grid Background="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100*"/>
<ColumnDefinition Width="80*"/>
<ColumnDefinition Width="100*"/>
</Grid.ColumnDefinitions>
<Border x:Name="border" Background="Red" BorderThickness="1" HorizontalAlignment="Left" Height="20" VerticalAlignment="Top" Width="143">
<TextBlock x:Name="locationTxt" Text="location" HorizontalAlignment="Center"></TextBlock>
</Border>
<TextBlock x:Name="quantityTxt" Text="quantity" Grid.Column="2" HorizontalAlignment="Center" TextWrapping="Wrap" VerticalAlignment="Top"/>
</Grid>
</UserControl>
and a page with stackpanel
<Page
x:Class="ScannerApp.FindPN___STEP2"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ScannerApp"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
...
<StackPanel>
<!--here I want to place the userControls-->
</StackPanel>
</Grid>
</Page>
I tried some sollutions like <controls: ...> //this could not be found by intellisense even or
<my:UserControlName Grid.Column="2" Grid.Row="2" ... />
<Window ...
xmlns:my="clr-namespace:AssemblyName"
...
/>
but I don't have the Window here... I tried to place something similar into the Page, but I don't really know what to type in there.
As said in comments, you've to fix your XAML. If you want to use custom controls you've to tell the compiler where the controls come from.
In case you Controls namespace is
ScannerApp.Custom_Controls
You've to write the Page XAML as
<Page
x:Class="ScannerApp.FindPN___STEP2"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:ScannerApp.Custom_Controls" <!--FIXED HERE-->
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
...
<StackPanel>
<local:NameOfYourControl x:Name="MyNewControl" /> <!--Properties can be added-->
</StackPanel>
</Grid>
</Page>
I have a TextBlock that is not wrapping and thinks it has an infinite width. I have tried to bind it to the actualWidth of the Grid and/or UserControl, but both widths come as more than 8000. I have tried disabling the HorizontalScrollBarVisibility in the parent view, but that does not work either. I have also read all question in SO that are related to mine and none of the suggestions seems to work.
<UserControl x:Class="Civica.UI.CurrentUserMenu.Views.ClassName"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="1200">
<UserControl.Resources>
<ResourceDictionary>
<SolidColorBrush x:Key="SeparatorBrush" Color="#66848484" />
</ResourceDictionary>
</UserControl.Resources>
<Grid>
<ScrollViewer x:Name="Viewer" BorderThickness="0" Grid.Column="1" Grid.Row="1" Margin="0,0,0,0" Padding="0"
VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
<Grid Background="White" HorizontalAlignment="Left" x:Name="UserControl">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Border BorderThickness="0,0,0,1" BorderBrush="{StaticResource SeparatorBrush}" Grid.Row="0">
<TextBlock Text="Text" Margin="0" FontWeight="Black" />
</Border>
<TextBlock Margin="5" Text="{Binding TextProperty}" TextWrapping="Wrap" Grid.Row="1"/>
</Grid>
</ScrollViewer>
</Grid>
</UserControl>
EDIT:
This is the code for the parent view:
<UserControl x:Class="Civica.UI.Ribbon.Views.ViewName"
d:DataContext="{d:DesignInstance Type=ViewMOdelName}"
d:DesignHeight="120"
d:DesignWidth="600"
mc:Ignorable="d">
<Grid ScrollViewer.HorizontalScrollBarVisibility="Disabled">
<telerik:RadRibbonView x:Name="RadRibbon"
Title="Title"
ApplicationButtonContent="Content"
ApplicationMenu="{Binding PropertyName}"
ApplicationName="{Binding PropertyName}"
MinimizeButtonVisibility="Visible"
SelectionChanged="SelectionChanged" ScrollViewer.HorizontalScrollBarVisibility="Disabled"/>
</Grid>
</UserControl>
It is the RadRibbonView that contains the first view.
The issue was a style that was being applied by the parent view and specifically a Telerik object. The solution was to find that style, decompile it and copy is to one of our files and change a scrollviewer to a border.