[.NET MAUI] DevExpress - ComboEdit SelectItemTemplate, Filter

이전 포스팅에 이서 SelectedItemTemplate 을 정의하여 선택된 모습을 변경해 보겠습니다.

이전 포스팅 : 2022.09.25 - [C#/Xamarin Maui] - [.NET MAUI] DevExpress - ComboEdit ItemTemplate

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
    x:Class="Maui.DevExpressTest.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:dxe="clr-namespace:DevExpress.Maui.Editors;assembly=DevExpress.Maui.Editors">
    <ContentPage.Resources>
        <ResourceDictionary>
            <DataTemplate x:Key="SelectItemTemplate">
                <StackLayout Padding="5">
                    <Label
                        FontAttributes="Bold"
                        FontSize="Medium"
                        Text="{Binding Name}"
                        TextColor="Black" />
                    <StackLayout Orientation="Horizontal">
                        <Label
                            FontSize="Small"
                            Text="{Binding Age, StringFormat='({0}) '}"
                            TextColor="Gray" />
                        <Label
                            FontSize="Small"
                            Text="{Binding Location}"
                            TextColor="Gray" />
                    </StackLayout>
                </StackLayout>
            </DataTemplate>
        </ResourceDictionary>
    </ContentPage.Resources>

    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25"
            VerticalOptions="Center">

            <dxe:ComboBoxEdit
                DisplayMember="Name"
                ItemsSource="{Binding Persons}"
                LabelText="Person"
                SelectedIndex="0"
                SelectedItemTemplate="{StaticResource SelectItemTemplate}">
                <dxe:ComboBoxEdit.ItemTemplate>
                    <DataTemplate>
                        <Grid ColumnDefinitions="*,*,*">
                            <Label
                                Padding="10"
                                FontAttributes="Bold"
                                Text="{Binding Name}" />
                            <Label
                                Grid.Column="1"
                                Padding="10"
                                Text="{Binding Age}" />
                            <Label
                                Grid.Column="2"
                                Padding="10"
                                HorizontalTextAlignment="End"
                                Text="{Binding Location}" />
                        </Grid>
                    </DataTemplate>
                </dxe:ComboBoxEdit.ItemTemplate>
            </dxe:ComboBoxEdit>

        </VerticalStackLayout>
    </ScrollView>

</ContentPage>

실행결과

IsFilterEnabled ='true' 로 하면 기본적인 Filter 기능을 제공하고 여러 옵션으로 Filter 조건처리가 가능합니다.

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
    x:Class="Maui.DevExpressTest.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:dxe="clr-namespace:DevExpress.Maui.Editors;assembly=DevExpress.Maui.Editors">
    
    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25"
            VerticalOptions="Center">
            
            <dxe:ComboBoxEdit
                DisplayMember="Name"
                FilterComparisonType="CurrentCultureIgnoreCase"
                FilterMode="Contains"
                IsFilterEnabled="True"
                ItemsSource="{Binding Persons}">
                <dxe:ComboBoxEdit.ItemTemplate>
                    <DataTemplate>
                        <Grid ColumnDefinitions="*,*,*">
                            <Label
                                Padding="10"
                                FontAttributes="Bold"
                                Text="{Binding Name}" />
                            <Label
                                Grid.Column="1"
                                Padding="10"
                                Text="{Binding Age}" />
                            <Label
                                Grid.Column="2"
                                Padding="10"
                                HorizontalTextAlignment="End"
                                Text="{Binding Location}" />
                        </Grid>
                    </DataTemplate>
                </dxe:ComboBoxEdit.ItemTemplate>
            </dxe:ComboBoxEdit>

        </VerticalStackLayout>
    </ScrollView>
</ContentPage>

실행결과

[Source]
https://github.com/kei-soft/Maui.DevExpressTest