Archives: FAQs

Holds Syncfusion FAQs and specific data

How do I create a single template and resue it for multiple columns in a ListView?

Here is a solution: [XAML] <Page xmlns=’http://schemas.microsoft.com/winfx/2006/xaml/presentation’ xmlns:x=’http://schemas.microsoft.com/winfx/2006/xaml’ xmlns:sys=’clr-namespace:System;assembly=mscorlib’> <Page.Resources> <XmlDataProvider x:Key=’CharacterData’> <x:XData> <Data xmlns=”> <Character First=’Bart’ Last=’Simpson’ Gender=’M’/> <Character First=’Homer’ Last=’Simpson’ Gender=’M’/> <Character First=’Lisa’ Last=’Simpson’ Gender=’F’/> <Character First=’Maggie’ Last=’Simpson’ Gender=’F’/> <Character First=’Marge’ Last=’Simpson’ Gender=’F’/> </Data> </x:XData> </XmlDataProvider> <DataTemplate x:Key=’LVTSimpleText’> <Border Width=’Auto’ Height=’Auto’ BorderBrush=’#FF000000′ BorderThickness=’0,0,2,2′> <TextBox Width=’Auto’ Height=’Auto’ Text='{Binding Value}’ TextWrapping=’Wrap’/> </Border> </DataTemplate> </Page.Resources> <ListView ItemsSource='{Binding Source={StaticResource CharacterData}, XPath=Data/Character}’> <ListView.View> <GridView> <GridViewColumn Header=’First Name’> <GridViewColumn.CellTemplate> <DataTemplate> <ContentControl Content='{Binding XPath=@First}’ ContentTemplate='{StaticResource LVTSimpleText}’ /> </DataTemplate> </GridViewColumn.CellTemplate> </GridViewColumn> <GridViewColumn Header=’Last Name’> <GridViewColumn.CellTemplate> <DataTemplate> <ContentControl Content='{Binding XPath=@Last}’ ContentTemplate='{StaticResource LVTSimpleText}’ /> </DataTemplate> </GridViewColumn.CellTemplate> </GridViewColumn> <GridViewColumn Header=’Gender’> <GridViewColumn.CellTemplate> <DataTemplate> <ContentControl Content='{Binding XPath=@Gender}’ ContentTemplate='{StaticResource LVTSimpleText}’ /> </DataTemplate> </GridViewColumn.CellTemplate> </GridViewColumn> </GridView> </ListView.View> </ListView> </Page>

How do I color the bg of my ListView in GridView mode based on a ‘search’ textbox where the user can enter search text?

This is kind of how Firefox lets you search texts – as you type in the search box the matching text all get highligted automatically. You can use this solution for other templatized controls as well. (For better formatting, take a look at this thread: How to color particular cell of the grid view?) [XAML] <Window x:Class=’SDKSample.Window1′ xmlns=’http://schemas.microsoft.com/winfx/2006/xaml/presentation’ xmlns:x=’http://schemas.microsoft.com/winfx/2006/xaml’ Loaded=’OnLoad’ xmlns:ds=’clr-namespace:SDKSample’> <Window.Resources> <ds:MyBGConverter x:Key=’myBGConverter’></ds:MyBGConverter> <ObjectDataProvider x:Key=’EmployeeInfoDataSource’ ObjectType='{x:Type ds:myEmployees}’/> <!–Repeat this for all columns where you want this to happen–> <DataTemplate x:Key=’myCellTemplateFN’> <DockPanel> <TextBlock Foreground=’Green’ HorizontalAlignment=’Center’> <TextBlock.Text> <Binding Path=’FirstName’/> </TextBlock.Text> <TextBlock.Background> <MultiBinding Converter='{StaticResource myBGConverter}’> <MultiBinding.Bindings> <Binding ElementName=’searchTB’ Path=’Text’ /> <Binding RelativeSource='{RelativeSource Self}’></Binding> </MultiBinding.Bindings> </MultiBinding> </TextBlock.Background> </TextBlock> </DockPanel> </DataTemplate> </Window.Resources> <Grid> <Grid.RowDefinitions> <RowDefinition Height=’50’/> <RowDefinition/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition/> </Grid.ColumnDefinitions> <TextBlock Grid.Row=’0′ Grid.Column=’0′ FontSize=’14’ HorizontalAlignment=’Center’> ListView created with XAML </TextBlock> <StackPanel Grid.Row=’1′ Grid.Column=’0′ HorizontalAlignment=’Center’> <ListView ItemsSource='{Binding Source= {StaticResource EmployeeInfoDataSource}}’ > <ListView.View> <GridView AllowsColumnReorder=’true’ ColumnHeaderToolTip=’Employee Information’> <GridViewColumn CellTemplate='{StaticResource myCellTemplateFN}’ Header=’First Name’ Width=’100’/> <GridViewColumn DisplayMemberBinding= ‘{Binding Path=LastName}’ Header=’Last Name’ Width=’100’/> <GridViewColumn DisplayMemberBinding= ‘{Binding Path=EmployeeNumber}’ Header=’Employee No.’ Width=’100’/> </GridView> </ListView.View> </ListView> <StackPanel Orientation=’Horizontal’> <TextBlock>Enter Search String Here:</TextBlock> <TextBox x:Name=’searchTB’ MinWidth=’100′ Width=’150′></TextBox> </StackPanel> </StackPanel> </Grid> </Window> And add this to your code-behind: [C#] public class MyBGConverter : IMultiValueConverter { #region IMultiValueConverter Members public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture) { TextBlock lvi = (TextBlock)values[1]; string filter = (string)values[0]; if (filter != String.Empty && lvi.Text.ToLower().Contains(filter.ToLower())) { return Brushes.Aqua; } else return Brushes.White; } public object[] ConvertBack(object value, Type[] targetTypes, object parameter, System.Globalization.CultureInfo culture) { throw new NotImplementedException(); } #endregion } public class EmployeeInfo { private string _firstName; private string _lastName; private string _employeeNumber; public string FirstName { get {return _firstName;} set {_firstName = value;} } public string LastName { get {return _lastName;} set {_lastName = value;} } public string EmployeeNumber { get {return _employeeNumber;} set {_employeeNumber = value;} } public EmployeeInfo(string firstname, string lastname, string empnumber) { _firstName = firstname; _lastName = lastname; _employeeNumber = empnumber; } } public class myEmployees : ObservableCollection { public myEmployees() { Add(new EmployeeInfo(‘Jesper’, ‘Aaberg’, ‘12345’)); Add(new EmployeeInfo(‘Dominik’, ‘Paiha’, ‘98765’)); Add(new EmployeeInfo(‘Yale’, ‘Li’, ‘23875’)); Add(new EmployeeInfo(‘Muru’, ‘Subramani’, ‘49392’)); } }

How do I debug my data-binding setup?

XAML code is not debuggable and any bindings that are setup in XAML or in code-behind are normally very tricky to debug as well. This article provides some ideas on how to setup debugging to get error information and such when binding happens: How can I debug WPF bindings