|
You can manage the visibility of a UIElement by using the UIElement.Visibility property. Similarly, you can also change the visibility of the UIElement loaded in the GridTemplateColumn based on the row data. This is demonstrated in the following code example. C# public class VisibilityConverter:IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
var values = (Model)value;
//Enables the visibility of an Ellipse UIElement when the country name is Germany, otherwise it hides from the view.
if (values.Country == "Germany")
return Visibility.Visible;
return Visibility.Hidden;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
}
}
The converter is bound to the Visibility property of an Ellipse UIElement as follows. XAML <syncfusion:GridTemplateColumn Width="100"
HeaderText="TemplateColumn"
MappingName="Country"
SetCellBoundValue="False">
<syncfusion:GridTemplateColumn.CellTemplate>
<DataTemplate>
<!--Ellipse is loaded in the display mode of the GridTemplateColumn-->.
<Ellipse Width="30"
Height="20"
Fill="Red"
Visibility="{Binding Converter={StaticResource visibilityConverter}}" />
</DataTemplate>
</syncfusion:GridTemplateColumn.CellTemplate>
</syncfusion:GridTemplateColumn>
The visibility of an ellipse is enabled when the country name is Germany as shown in the following screenshot.
Figure 1: UIElement visibility is displayed based on the data Sample Links: |
2X faster development
The ultimate UWP UI toolkit to boost your development speed.
This page will automatically be redirected to the sign-in page in 10 seconds.
You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.
