Hey I am trying to show different pictures based on boolean values with triggers, I have one image a simple where it shows the green one when it is true, that works but wiht the triggers, I get an empty unhandled exception.
What am I missing?
Thanks
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal">
<Label Text="{Binding Content}" FontSize="26"></Label>
<Image Source="green.png" HorizontalOptions="EndAndExpand" Aspect="AspectFit" IsVisible="{Binding Done}"></Image>
<Image>
<Image.Style>
<Style TargetType="{x:Type Image}">
<Style.Triggers>
<DataTrigger Binding="{Binding Done}" Value="false">
<Setter Property="Source" Value="red.png"></Setter>
</DataTrigger>
<DataTrigger Binding="{Binding Done}" Value="true">
<Setter Property="Source" Value="green.png"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</Image.Style>
</Image>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Related
I have this ControlTemplate (two controls on it):
<Style TargetType="controls:QuickSearch">
<Setter Property="ControlTemplate">
<Setter.Value>
<ControlTemplate>
<VerticalStackLayout HorizontalOptions="Fill">
<Entry
x:Name="EntryFilter"
Text="{TemplateBinding Filter}"
Completed="Entry_Completed"
behaviors:SetFocusOnEntryCompletedBehavior.NextElement="{x:Reference LstResults}"
Focused="Entry_Focused"
ClearButtonVisibility="WhileEditing"
Placeholder="{TemplateBinding PlaceHolder,Mode=TwoWay}">
<Entry.Triggers>
<EventTrigger Event="Completed">
</EventTrigger>
</Entry.Triggers>
</Entry>
<ListView
x:Name="LstResults"
Margin="5"
Background="{DynamicResource PN_ColorFondoPrimario}"
ZIndex="999"
ItemsSource="{TemplateBinding Results}"
SelectionMode="Single"
SelectedItem="{TemplateBinding SelectedItem,Mode=TwoWay}"
IsVisible="{TemplateBinding PerforminigSearch}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Label Text="{Binding DisplayField}" Margin="9"/>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.Triggers>
</ListView.Triggers>
</ListView>
</VerticalStackLayout>
<-- MAUI don't allow to set triggers here -->
<ControlTemplate.Triggers>
</ControlTemplate.Triggers>
<-- ======================================= -->
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
And I want to set the focus into EntryFilter when my control template receives focus. I was trying with a trigger, but MAUI doesn't allow me to put some triggers into the <ControlTemplate> tag.
<Style TargetType="controls:QuickSearch">
<Style.Triggers>
<Trigger Property="IsFocused" Value="True">
<Setter TargetName="EntryFilter" Property="IsFocused" Value="True"/>
</Trigger>
</Style.Triggers>
. . . .
. . . .
</Style>
I tried with MAUI toolkit, but where should I put SetFocusOnEntryCompletedBehavior?
I´m developing an app in .net maui and i have a question i have not answered myself through browsing.
I'm trying to apply a shadow to a border and the following code works perfectly.
<Border
Style="{StaticResource light-theme-border}"
Grid.Column="1"
Grid.Row="3"
Grid.ColumnSpan="7">
<Border.Shadow>
<Shadow
Brush="red"
Offset="1,11"
Radius="20"
Opacity="0.25"/>
</Border.Shadow>
</Border>
But when i write shadow directly inside the border properties it catches the property but i don't know how to dump the [brush, offset, radius & opacity] info:
<Border
Style="{StaticResource light-theme-border}"
Grid.Column="1"
Grid.Row="3"
Grid.ColumnSpan="7"
Shadow="???????????????????????????">
</Border>
You can then define and consume it as a resource (same what you did with Style property):
<ContentPage.Resources>
<ResourceDictionary>
<Shadow
x:Key="CommonShadow"
Brush="red"
Offset="1,11"
Radius="20"
Opacity="0.25"/>
<Border
Style="{StaticResource light-theme-border}"
Grid.Column="1"
Grid.Row="3"
Grid.ColumnSpan="7"
Shadow="{StaticResource CommonShadow}">
</Border>
Or integrate it in your existing style of Border
<ContentPage.Resources>
<ResourceDictionary>
<Style x:Key="light-theme-border" TargetType="Border">
<Setter Property="WidthRequest" Value="20" />
<Setter Property="Shadow">
<Setter.Value>
<Shadow
Brush="red"
Opacity="1"
Radius="50"
Offset="20,20" />
</Setter.Value>
</Setter>
</Style>
<Border
Style="{StaticResource light-theme-border}"
Grid.Column="1"
Grid.Row="3"
Grid.ColumnSpan="7">
</Border>
Or integrate it in your existing style of Border as a static resource
<ContentPage.Resources>
<ResourceDictionary>
<Shadow
x:Key="CommonShadow"
Brush="red"
Offset="1,11"
Radius="20"
Opacity="0.25"/>
<Style x:Key="light-theme-border" TargetType="Border">
<Setter Property="WidthRequest" Value="20" />
<Setter Property="Shadow" Value="{StaticResource CommonShadow}"/>
</Style>
</ResourceDictionary>
</ContentPage.Resources>
<Border
Style="{StaticResource light-theme-border}"
Grid.Column="1"
Grid.Row="3"
Grid.ColumnSpan="7">
</Border>
I'm currently facing a problem in one of my Xaml Files. I created a combox with 2 fixed combobox Items. I also created a textblock. Here is the xaml code :
<StackPanel>
<TextBlock Grid.Column="0" x:Name="UserSettingsConnectorGroupBoxProductTextBlock" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding Strings.UserSettingsConnectorGroupBoxProductText, Source={StaticResource StringLocalizer}}" VerticalAlignment="Center" Margin="10,0,0,0" />
<ComboBox Grid.Column="1" x:Name="UserSettingsConnectorGroupBoxProductComboBox" VerticalAlignment="Center" Width="300" HorizontalAlignment="Left" Margin="10,5,0,0" SelectionChanged="UserSettingsConnectorGroupBoxProductComboBox_SelectionChanged" >
<ComboBoxItem Content="Microsoft Deployment Toolkit" />
<ComboBoxItem Content="Microsoft System Center Configuration Manager" />
</ComboBox>
<StackPanel Orientation="Vertical" HorizontalAlignment="Left" Margin="10,0,0,0">
<TextBlock Name="ConnectorTextBlock" Text="toto" Margin="0,5" >
<TextBlock.Style>
<Style TargetType="TextBlock">
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=UserSettingsConnectorGroupBoxProductComboBox, Path=Text}" Value="Microsoft Deployment Toolkit">
<Setter Property="Text" Value="{Binding Strings.UserSettingsConnectorGroupBoxProductTextBlockConnectorPathMDT, Source={StaticResource StringLocalizer}}" />
</DataTrigger>
<DataTrigger Binding="{Binding ElementName=UserSettingsConnectorGroupBoxProductComboBox, Path=Text}" Value="Microsoft System Center Configuration Manager">
<Setter Property="Text" Value="{Binding Strings.UserSettingsConnectorGroupBoxProductTextBlockConnectorPathSCCM, Source={StaticResource StringLocalizer}}" />
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
<StackPanel Orientation="Horizontal" >
<TextBox Name="ConnectorTextBox" Margin="0,5" Width="300">
</TextBox>
<Button Content="Test" Margin="5" Width="100" HorizontalAlignment="Right"/>
</StackPanel>
<Button Content="Save" Width="100" HorizontalAlignment="Left" Margin="0,5" IsEnabled="False"/>
</StackPanel>
And a preview :
enter image description here
I would like the text of textBlock named "ConnectorTextBox" changes when the combobox Selected Item Changes. In order to do this, i created 2 datatriggers in TextBlock bound to "Text" Property of Combobox Control. Depending on the value of Text property, the Text value of textblock changes.
But it does not function. Only default value "Toto" is diplayed, even if i change my combobox Selection.
Any help would be greatly appreciated :) :)
Regis
Avoid setting Text property of TextBlock. Try this
<TextBlock Name="ConnectorTextBlock" Margin="0,5" >
<TextBlock.Style>
<Style TargetType="TextBlock">
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=UserSettingsConnectorGroupBoxProductComboBox, Path=Text}" Value="Microsoft Deployment Toolkit">
<Setter Property="Text" Value="{Binding Strings.UserSettingsConnectorGroupBoxProductTextBlockConnectorPathMDT, Source={StaticResource StringLocalizer}}" />
</DataTrigger>
<DataTrigger Binding="{Binding ElementName=UserSettingsConnectorGroupBoxProductComboBox, Path=Text}" Value="Microsoft System Center Configuration Manager">
<Setter Property="Text" Value="{Binding Strings.UserSettingsConnectorGroupBoxProductTextBlockConnectorPathSCCM, Source={StaticResource StringLocalizer}}" />
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
If you want to set a default value, do it as below
<TextBlock Name="ConnectorTextBlock" Margin="0,5" >
<TextBlock.Style>
<Style TargetType="TextBlock">
<Setter Property="Text" Value="Toto" />
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=UserSettingsConnectorGroupBoxProductComboBox, Path=Text}" Value="Microsoft Deployment Toolkit">
<Setter Property="Text" Value="{Binding Strings.UserSettingsConnectorGroupBoxProductTextBlockConnectorPathMDT, Source={StaticResource StringLocalizer}}" />
</DataTrigger>
<DataTrigger Binding="{Binding ElementName=UserSettingsConnectorGroupBoxProductComboBox, Path=Text}" Value="Microsoft System Center Configuration Manager">
<Setter Property="Text" Value="{Binding Strings.UserSettingsConnectorGroupBoxProductTextBlockConnectorPathSCCM, Source={StaticResource StringLocalizer}}" />
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
Hope this helps!!
For the XAML below I'm using AvalonDock 2.0.2. I'm wanting to set the font of the Title property of the LayoutAnchorable
<xcad:DockingManager Name="TabItemDockingManager"
AllowMixedOrientation="True"
BorderBrush="Black"
BorderThickness="0" Height="Auto" Width="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
AnchorablesSource="{Binding Anchorables, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" viewModels:AvalonDockLayoutSerializer.LoadLayoutCommand="{Binding ADLayout.LoadLayoutCommand}" viewModels:AvalonDockLayoutSerializer.SaveLayoutCommand="{Binding ADLayout.SaveLayoutCommand}">
<xcad:DockingManager.LayoutUpdateStrategy>
<pane:LayoutInitializer/>
</xcad:DockingManager.LayoutUpdateStrategy>
<xcad:DockingManager.LayoutItemTemplateSelector>
<pane:PanesTemplateSelector>
<pane:PanesTemplateSelector.MyViewTemplate>
<DataTemplate>
...
</DataTemplate>
</pane:PanesTemplateSelector.MyViewTemplate>
</pane:PanesTemplateSelector>
</xcad:DockingManager.LayoutItemTemplateSelector>
<xcad:DockingManager.LayoutItemContainerStyleSelector>
<pane:PanesStyleSelector>
<pane:PanesStyleSelector.ToolStyle>
<Style TargetType="{x:Type xcad:LayoutAnchorableItem}">
<Setter Property="Title" Value="{Binding Model.Title}"/>
<Setter Property="IconSource" Value="{Binding Model.IconSource}"/>
<Setter Property="Visibility" Value="{Binding Model.IsVisible, Mode=TwoWay, Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter={x:Static Visibility.Hidden}}"/>
<Setter Property="ContentId" Value="{Binding Model.ContentId}"/>
<Setter Property="IsSelected" Value="{Binding Model.IsSelected, Mode=TwoWay}"/>
<Setter Property="IsActive" Value="{Binding Model.IsActive, Mode=TwoWay}"/>
</Style>
</pane:PanesStyleSelector.ToolStyle>
</pane:PanesStyleSelector>
</xcad:DockingManager.LayoutItemContainerStyleSelector>
<xcad:LayoutRoot x:Name="_LayoutRoot">
<xcad:LayoutPanel Orientation="Vertical">
<xcad:LayoutAnchorablePane Name="AnchorablesPane" DockHeight="150">
</xcad:LayoutAnchorablePane>
</xcad:LayoutPanel>
</xcad:LayoutRoot>
</xcad:DockingManager>
I can set the Title text (which is done via reading/loading the layout), however I don't see a Font/FontFamily property I can set
Does anyone know how this can be done ?
Thanks to Attila (apols that I cannot mark his answer as I don't have enough points)
AvalonDock 2.2 - Full width TitleTemplate (fill parent container)
AvalonDock is a fantastic library - that said implementing it with MVVM is a challenge but the below seems to work well
<xcad:DockingManager.Resources>
<DataTemplate x:Key="DockingWindowTitleDataTemplate" DataType="{x:Type xcad:LayoutContent}">
<Label>
<TextBlock Text="{Binding Path=Title}" Margin="5,0,0,0" VerticalAlignment="Center" FontSize="14" />
</Label>
</DataTemplate>
</xcad:DockingManager.Resources>
<xcad:DockingManager.AnchorableTitleTemplate>
<StaticResource ResourceKey="DockingWindowTitleDataTemplate" />
</xcad:DockingManager.AnchorableTitleTemplate>
How can I make content of each ListView item expands to 100% width when using a DataTemplate?
I have tried HorizontalContentAlignment="Stretch" in the ListView and HorizontalAlignment="Stretch" in the DataTemplate, but nothing seems to work, content is still aligned to the left.
I have something like this:
<ListView x:Name="questionsView" Background="{StaticResource ApplicationPageBackgroundThemeBrush}" HorizontalContentAlignment="Stretch">
<ListView.ItemTemplate>
<DataTemplate>
<Border Background="BlueViolet" HorizontalAlignment="Stretch">
<Grid HorizontalAlignment="Stretch">
<TextBlock Text="{Binding}" />
<TextBlock HorizontalAlignment="Right">16 minutes ago</TextBlock>
</Grid>
</Border>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I guess there is one more layer between the ListView and the ItemTemplate.
I got it. Setting the ListView.ItemContainerStyle with a HorizontalContentAlignment setter makes the trick. I.e.:
<ListView x:Name="questionsView" Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<ListView.ItemTemplate>
<DataTemplate>
<Border Background="BlueViolet">
<Grid HorizontalAlignment="Stretch" Margin="0">
<TextBlock Text="{Binding}" />
<TextBlock HorizontalAlignment="Right">16 minutes ago</TextBlock>
</Grid>
</Border>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
</ListView>
Set the item container's property of HorizontalContentAlignment to Stretch, try this
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
What is important here is the ScrollViewer.HorizontalScrollBarVisibility, TextWrapping and ItemContainerStyle with HorizontalContentAlignment. The rest is fluff.
<ListView VerticalAlignment="Stretch"
ScrollViewer.VerticalScrollBarVisibility="Auto"
ScrollViewer.HorizontalScrollBarVisibility="Disabled">
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Prop1}" TextWrapping="Wrap"/>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
</ListView>