I have data source which, getting bind to grid in WPF. Data source is
array of students, with following fields
Name, Grade
Grid have 3 columns
Name, Grade, Settings
Settings column contains simple button for settings as below
<DataGridTemplateColumn Header="Settings" Width="75" CanUserResize="False">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button Name="cSettings" Click="cSettings_Click" Style="{DynamicResource EditSettingsButton}" Width="50" >
</Button>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
Now, If grade is equal to one then only,Settings Button should get displayed.
Can I write condition in XAML itself ? i.e. Visibility of button should be on some condition ?
Tried below approach but not working
<DataTemplate>
<Button Name="cSettings" Click="cSettings_Click" Style="{DynamicResource EditSettingsButton}" Width="50" >
<Style TargetType="{x:Type Button}">
<Style.Triggers>
<DataTrigger Binding="{Binding Grade}" Value="1">
<Setter Property="Visibility" Value="Visible"></Setter>
</DataTrigger>
<DataTrigger Binding="{Binding Grade}" Value="2">
<Setter Property="Visibility" Value="Hidden"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</Button>
</DataTemplate>
Thanks
You could try using a converter instead. See this link
Related
In Xamarin Forms (Portable) project when I place RadlistView in first page I got binded list which not render template in Android. I not checked other platforms. In this case the RadListView in second page is rendered ok.
First page with RadListView
Second page with RadListView
But if I replace radlistview in first page with Xamarin.Forms.ListView, it showed normal but in the second page RadListView showed without template.
The first page with Xamarin ListView
Second page with RadListView losted template
First page code below :
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Name="Page"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:telerikPrimitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"
xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:viewmodels="clr-namespace:InRestoApp.ViewModels"
xmlns:behaviors="clr-namespace:InRestoApp.Behaviors"
xmlns:helpers="clr-namespace:InRestoApp.Helpers"
x:Class="InRestoApp.Views.HallsPage">
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness">
<On Platform="iOS" Value="10, 20, 10, 0" />
<On Platform="Android, UWP" Value="10, 0" />
</OnPlatform>
</ContentPage.Padding>
<ContentPage.Resources>
<helpers:InvertBoolConverter x:Key="invertBoolConverter"/>
</ContentPage.Resources>
<Grid HeightRequest="800">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<telerikDataControls:RadListView x:Name="ItemsListView" SelectionMode="Single" HeightRequest="800"
ItemsSource="{Binding Halls}"
ItemTapped="ListView_OnItemTapped">
<telerikDataControls:RadListView.LayoutDefinition>
<telerikListView:ListViewLinearLayout VerticalItemSpacing="0" />
</telerikDataControls:RadListView.LayoutDefinition>
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<Frame CornerRadius="5" HasShadow="True" OutlineColor="#4488F6" Padding="10" Margin="10">
<StackLayout Orientation="Horizontal">
<Label Text="{Binding HallCode}" FontSize="Large" VerticalOptions="StartAndExpand" />
<Label Text="{Binding HallName}" FontSize="Medium" VerticalOptions="CenterAndExpand" />
</StackLayout>
</Frame>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</Grid>
</ContentPage>
Second view XAML below (Used ContentView because it is openening as slide drawer)
<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:flv="clr-namespace:DLToolkit.Forms.Controls;assembly=DLToolkit.Forms.Controls.FlowListView"
xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
xmlns:helpers="clr-namespace:InRestoApp.Helpers"
xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"
xmlns:telerikInput="clr-namespace:Telerik.XamarinForms.Input;assembly=Telerik.XamarinForms.Input"
x:Name="productView"
x:Class="InRestoApp.Views.ProductsView">
<ContentView.Resources>
<helpers:ImageBytesConverter x:Key="imageBytesConverter"/>
<helpers:TempConverter x:Key="tempConverter"/>
<helpers:ImageFileToImageSourceConverter x:Key="imageFileToImageSourceConverter"/>
</ContentView.Resources>
<ContentView.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="4*"/>
<ColumnDefinition Width="6*"/>
</Grid.ColumnDefinitions>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Frame CornerRadius="2" HasShadow="True" OutlineColor="Aquamarine" Padding="10" Margin="2">
<Image x:Name="btnClear" Source="clear_icon.png" HeightRequest="50" WidthRequest="50" >
<Image.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Path=BindingContext.ClearProductsFilterCommand, Source={x:Reference productView}}" CommandParameter="{Binding .}" />
</Image.GestureRecognizers>
</Image>
</Frame>
<telerikDataControls:RadListView x:Name="CategoriesListView" Grid.Row="1" SelectedItem="{Binding SelectedProductCategory, Mode=TwoWay}" SelectionMode="Single"
ItemsSource="{Binding ProductCategories}">
<telerikDataControls:RadListView.LayoutDefinition>
<telerikListView:ListViewLinearLayout VerticalItemSpacing="0" />
</telerikDataControls:RadListView.LayoutDefinition>
<!--<telerikDataControls:RadListView.ItemStyle>
<telerikListView:ListViewItemStyle BackgroundColor="Transparent" BorderLocation="None"/>
</telerikDataControls:RadListView.ItemStyle>-->
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<Frame CornerRadius="10" HasShadow="True" OutlineColor="#4488F6" Padding="10" Margin="10" >
<StackLayout Orientation="Horizontal">
<StackLayout>
<ffimageloading:CachedImage HeightRequest="70" Aspect="AspectFill" WidthRequest="70" Margin="5"
DownsampleHeight="70" DownsampleUseDipUnits="false"
LoadingPlaceholder="image_loading.png" ErrorPlaceholder="image_error.png"
Source="{Binding FileName, Converter={StaticResource imageFileToImageSourceConverter}}"/>
<Label Text="{Binding ProductCategoryName}" FontSize="Medium" VerticalOptions="CenterAndExpand" />
</StackLayout>
</StackLayout>
</Frame>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</Grid>
<telerikDataControls:RadListView x:Name="ProductsListView" Grid.Column="1" SelectedItem="{Binding SelectedProduct, Mode=TwoWay}" SelectionMode="Single"
ItemsSource="{Binding Products}">
<telerikDataControls:RadListView.LayoutDefinition>
<telerikListView:ListViewLinearLayout VerticalItemSpacing="0" />
</telerikDataControls:RadListView.LayoutDefinition>
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<Frame CornerRadius="10" HasShadow="True" OutlineColor="#4488F6" Margin="5" HeightRequest="110" >
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="70"/>
<RowDefinition Height="20"/>
<RowDefinition Height="20"/>
</Grid.RowDefinitions>
<ffimageloading:CachedImage HeightRequest="70" Aspect="AspectFit" WidthRequest="70" Margin="2"
DownsampleHeight="50" DownsampleUseDipUnits="false"
LoadingPlaceholder="image_loading.png" ErrorPlaceholder="image_error.png"
Source="{Binding FileName, Converter={StaticResource imageFileToImageSourceConverter}}"/>
<Label Text="{Binding RestProductNameEntity.ProductName}" FontSize="Medium" VerticalOptions="CenterAndExpand" Grid.Row="1" />
<telerikInput:RadNumericInput Value="{Binding Quantity, Mode=TwoWay}" Grid.Row="2" HeightRequest="20" />
</Grid>
</Frame>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</Grid>
</ContentView.Content>
</ContentView>
c# file not providing because it used web api from another project, also using dummy source has same effect. As source used
ObservableCollection
I forgot add that before issue I updated Telerik Xamarin platform. After clean solution, deleting bin and obj folders and rebild project it solved.
I'm trying to implement a Flyout menu in a Windows 10 App (using MVVM) that opens when holding down an item of a GridView. I've been looking and I haven't been able to find any examples that works for me. The Flyout menu is not opening to display options. Does anyone know how can I do it?
<GridView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyoutItem Text="Delete" Command="{Binding DeleteCommand}"/>
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<Image Source="{Binding Dictionary}" Height="25"/>
<TextBlock Text="{Binding Title}" Foreground="White" Width="170"/>
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
Note: Solution found in https://marcominerva.wordpress.com/2013/12/17/using-a-behavior-to-open-attached-flyouts-in-winows-81-store-apps/
I think what you want to set is StackPanel.Flyout instead of FlyoutBase
<GridView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<StackPanel.Flyout>
<MenuFlyout>
<MenuFlyoutItem Text="Delete" Command="{Binding DeleteCommand}"/>
</MenuFlyout>
</StackPanel.Flyout>
<Image Source="{Binding Dictionary}" Height="25"/>
<TextBlock Text="{Binding Title}" Foreground="White" Width="170"/>
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
Alternatively if this doesn't work for you you can target the GridViewItem.Flyout
<GridView>
<GridView.Resources>
<Style TargetType="GridViewItem">
<Setter Property="Flyout">
<Setter.Value>
<MenuFlyout>
<MenuFlyoutItem Text="Delete" Command="{Binding DeleteCommand}"/>
</MenuFlyout>
</Setter.Value>
</Setter>
</Style>
</Gridview.Resources>
I have one list as RoomGroupList and another as RooList,One Room Group have multiple Roos in it, like
RoomGroup 1 => Room-1
Room-2
Room-3
I have bound RoomGroupList to ListView and RoomGroupControll is Generating From it as,
<ListView x:Name="lstRoomGroupList" SelectionMode="Single" ItemsSource="{Binding roomGroupList,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" SelectedItem="{Binding evokoRoomGroup,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
<ListView.ItemTemplate>
<DataTemplate>
**<UserConrols:RoomGroupControl/>**
</DataTemplate>
</ListView.ItemTemplate
Now RoomGroupControl has one ListView to Listout No.ofRooms in it as,
<ListView x:Name="lstRoomList" Grid.Row="3" ItemsSource="{Binding GetroomList,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
SelectedValue="{Binding DataContext.EvokoRoom,ElementName=tbDashBoard,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
HorizontalAlignment="Stretch" VerticalAlignment="Top" Background="#F3F3F5"
BorderBrush="LightGray" BorderThickness="0"
Margin="0,0,0,0" Height="Auto" MaxHeight="200" ScrollViewer.VerticalScrollBarVisibility="Visible">
<ListView.ItemTemplate>
<DataTemplate>
**<UserConrols:RoomControl/>**
</DataTemplate>
</ListView.ItemTemplate>
what I want is,when I click on any button from ListElements at that time it's corresponding ListItem(row) should be selected so that I have added EventSetter using Resource on RoomGroupList as
<ListView.Resources>
<Style TargetType="{x:Type ListViewItem}">
<EventSetter Event="PreviewGotKeyboardFocus" Handler="SelectCurrentItem"/>
</Style>
</ListView.Resources>
It's working properly for RoomGroupList I'm able to select Different Groups but Problem is I Can't select Rooms From RoomGroup which I have selected.
If anyone knows how to manage this, can also provide me Links and Suggestions,Thanks.
I've been trying to use Attached Behaviors in a simple Windows Store App using the MVVM Light framework. Since we can't use System.Windows.Interactivity, as in Windows Phone, I've been using both Windows.UI.Interactivity and WinRtBehaviors lybraries. They work well but the problem is that I can't declare an attached behavior inside a data template.
What I really want is to attach a command to any item in a GridView, so that I can pass the item id as the parameter. Since that attached behavior doesen't work, the only solution I found consists on using the "SelectionChanged" event of the GridView and pass the SelectedItem as the parameter to a property in the ViewModel:
<GridView Grid.Row="1"
x:Name="itemGridView"
AutomationProperties.AutomationId="ItemsGridView"
AutomationProperties.Name="Items"
TabIndex="1"
Padding="116,136,116,46"
ItemsSource="{Binding GeoTopArtists.topartists.artist}"
SelectionMode="Single"
SelectedItem="{Binding SelectedArtist, Mode=TwoWay}"
IsSwipeEnabled="False"
IsItemClickEnabled="False">
<WinRtBehaviors:Interaction.Behaviors>
<Win8nl_Behavior:EventToCommandBehavior Event="SelectionChanged" Command="SelectArtistCommand" CommandParameter="{Binding SelectedArtist.mbid}"/>
</WinRtBehaviors:Interaction.Behaviors>
<GridView.ItemTemplate>
<DataTemplate>
<Grid HorizontalAlignment="Left" Width="250" Height="250">
<Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}">
<Image Source="{Binding image[4].text}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
</Border>
<StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
<TextBlock Text="{Binding name}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="60" Margin="15,0,15,0"/>
<TextBlock Text="{Binding url}" Foreground="{StaticResource ListViewItemOverlaySecondaryForegroundThemeBrush}" Style="{StaticResource CaptionTextStyle}" TextWrapping="NoWrap" Margin="15,0,15,10"/>
</StackPanel>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
It would be very nice doing something like that (where there's no need to have a SelectedArtist property in the ViewModel)
<GridView Grid.Row="1"
x:Name="itemGridView"
AutomationProperties.AutomationId="ItemsGridView"
AutomationProperties.Name="Items"
TabIndex="1"
Padding="116,136,116,46"
ItemsSource="{Binding GeoTopArtists.topartists.artist}"
SelectionMode="None"
IsSwipeEnabled="False"
IsItemClickEnabled="False">
<GridView.ItemTemplate>
<DataTemplate>
<Grid HorizontalAlignment="Left" Width="250" Height="250">
<Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}">
<Image Source="{Binding image[4].text}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
</Border>
<StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
<TextBlock Text="{Binding name}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="60" Margin="15,0,15,0"/>
<TextBlock Text="{Binding url}" Foreground="{StaticResource ListViewItemOverlaySecondaryForegroundThemeBrush}" Style="{StaticResource CaptionTextStyle}" TextWrapping="NoWrap" Margin="15,0,15,10"/>
</StackPanel>
<WinRtBehaviors:Interaction.Behaviors>
<Win8nl_Behavior:EventToCommandBehavior Event="Tapped" Command="SelectArtistCommand" CommandParameter="{Binding Artist.mbid}"/>
</WinRtBehaviors:Interaction.Behaviors>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
This link may help you out. The dependency property is defined and hooked to a command in view model. So whenever there is interaction in view, the selected item can be sent as commanding parameter which is clearly demonstrated in this video.
I am writing a small WPF application using MVVM pattern.
I set some style resources for buttons into my main window and I would like them to apply to the buttons into the views. The problem is that some of the buttons are having a style with trigger. So I would like to inherit this style from the generic one
here is my main window code:
<Window.Resources>
<DataTemplate DataType="{x:Type vm:HomeViewModel}">
<views:HomeView/>
</DataTemplate>
<DataTemplate DataType="{x:Type vm:DetailReportViewModel}">
<views:DetailReportView/>
</DataTemplate>
<DataTemplate DataType="{x:Type vm:TransferViewModel}">
<views:TransferView/>
</DataTemplate>
<Style TargetType="{x:Type Button}">
<Setter Property="Margin" Value="5"/>
<Setter Property="MinWidth" Value="30"/>
<Setter Property="Foreground" Value="Red"/>
</Style>
<Style TargetType="{x:Type ComboBox}">
<Setter Property="Margin" Value="5"/>
</Style>
</Window.Resources>
here is the button XAML into my view/usercontrol
<Button Content="Delete" Command="{Binding DeleteReportCommand}">
<Button.Style>
<Style TargetType="{x:Type Button}">
<Style.Triggers>
<DataTrigger Binding="{Binding Mode}">
<DataTrigger.Value>
<vm:Mode>Add</vm:Mode>
</DataTrigger.Value>
<Setter Property="Visibility" Value="Collapsed"/>
</DataTrigger>
<DataTrigger Binding="{Binding Mode}">
<DataTrigger.Value>
<vm:Mode>Edit</vm:Mode>
</DataTrigger.Value>
<Setter Property="Visibility" Value="Visible"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
I tried to used BasedOn="{StaticResource {x:Type Button} to inherit but it doesn't seems to work (see img)
I tried with a key name but static resource won't find the key name as it's not on the same view. And BasedOn is not accepting Dynamic resource.
Anything I am missing?
Thank you
You can put all the custom styles in a separate resource dictionary file and you can add it in usercontrol.resources.
Refer this: http://www.codeproject.com/Articles/35346/Using-a-Resource-Dictionary-in-WPF
Or you can put all those in app.xaml (Application.Resources).
Refer this: http://msdn.microsoft.com/en-us/library/system.windows.resourcedictionary.aspx