728x90
728x170
2022.03.01 - [Xamarin_MAUI] - [.NET MAUI] Syncfusion 의 SfListView 사용하기
위 SfListView 내용에이어 item 을 선택한 경우 선택한 아이템에 대한 디자인 처리 방법
SelectionBackground="Skyblue" 를 이용하여 선택한 항목의 배경색 변경
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="MauiApp1.SfListViewTestView"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:syncfusion="clr-namespace:Syncfusion.Maui.ListView;assembly=Syncfusion.Maui.ListView"
Title="SfListView"
BackgroundColor="White">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<SearchBar
x:Name="filterText"
HeightRequest="40"
Placeholder="Search here to filter"
TextChanged="OnFilterTextChanged"/>
<syncfusion:SfListView
Grid.Row="1"
x:Name="listView"
ItemSize="100"
ItemsSource="{Binding BookInfo}"
SelectionBackground="Skyblue">
<syncfusion:SfListView.ItemTemplate>
<DataTemplate>
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="0.4*" />
<RowDefinition Height="0.6*" />
</Grid.RowDefinitions>
<Label Text="{Binding BookName}" FontAttributes="Bold" TextColor="Blue" FontSize="21" />
<Label Grid.Row="1" Text="{Binding BookDescription}" TextColor="Teal" FontSize="15"/>
</Grid>
</DataTemplate>
</syncfusion:SfListView.ItemTemplate>
</syncfusion:SfListView>
</Grid>
</ContentPage>
SelectedItemTemplate 을 이용해 커스텀하게 배경색과 글자색 글자 크기등을 변경
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="MauiApp1.SfListViewTestView"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:syncfusion="clr-namespace:Syncfusion.Maui.ListView;assembly=Syncfusion.Maui.ListView"
Title="SfListView"
BackgroundColor="White">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<SearchBar
x:Name="filterText"
HeightRequest="40"
Placeholder="Search here to filter"
TextChanged="OnFilterTextChanged"/>
<syncfusion:SfListView
Grid.Row="1"
x:Name="listView"
ItemSize="100"
ItemsSource="{Binding BookInfo}"
SelectionBackground="Skyblue">
<syncfusion:SfListView.SelectedItemTemplate>
<DataTemplate>
<Grid x:Name="grid" BackgroundColor="RoyalBlue">
<Grid.RowDefinitions>
<RowDefinition Height="0.4*" />
<RowDefinition Height="0.6*" />
</Grid.RowDefinitions>
<Label Text="{Binding BookName}" FontAttributes="Bold" TextColor="Black" FontSize="25" />
<Label Grid.Row="1" Text="{Binding BookDescription}" TextColor="White" FontSize="16"/>
</Grid>
</DataTemplate>
</syncfusion:SfListView.SelectedItemTemplate>
<syncfusion:SfListView.ItemTemplate>
<DataTemplate>
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="0.4*" />
<RowDefinition Height="0.6*" />
</Grid.RowDefinitions>
<Label Text="{Binding BookName}" FontAttributes="Bold" TextColor="Blue" FontSize="21" />
<Label Grid.Row="1" Text="{Binding BookDescription}" TextColor="Teal" FontSize="15"/>
</Grid>
</DataTemplate>
</syncfusion:SfListView.ItemTemplate>
</syncfusion:SfListView>
</Grid>
</ContentPage>
728x90
그리드형
'C# > Xamarin Maui' 카테고리의 다른 글
[.NET MAUI] x:static 사용하기 (0) | 2022.03.03 |
---|---|
[.NET MAUI] 플래폼(Android,iOS)에 따른 code 및 xaml 단 처리 방법 (0) | 2022.03.01 |
[.NET MAUI] Syncfusion 의 SfListView 사용하기 (0) | 2022.03.01 |
[.NET MAUI] 이미지 , 폰트 추가 (0) | 2022.03.01 |
[.NET MAUI] 참고 사이트 모음 (0) | 2022.02.28 |