UWP中的多选Listview函数

时间:2019-03-20 02:35:20

标签: c# json listview uwp

我有一个带有多个选择的“ updateList”列表视图。我想要如果用户单击(选择/选中)列表视图中的项目,它将转到“ selectedUpdateList”列表视图。并且,如果用户单击(未选中)列表视图上的相同项目,则该项目将从“ selectedUpdateList”列表视图中删除。 XAML:

<ListView x:Name="updateList" Grid.Row="1" Margin="20,10,20,20"
                          AutomationProperties.AutomationId="ItemsListView"
                          AutomationProperties.Name="Items"
                          ItemsSource="{Binding Source={StaticResource itemsViewSource}}"
                          HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
                          ScrollViewer.VerticalScrollBarVisibility="Visible"
                          IsSwipeEnabled="False" SelectionMode="Multiple"
                          IsItemClickEnabled="True" IsMultiSelectCheckBoxEnabled="True" ItemClick="UpdateList_ItemClick">

                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <Grid Margin="0,20,0,0" HorizontalAlignment="Stretch" Background="{x:Null}">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="auto"/>
                                    <ColumnDefinition Width="auto"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>

                                <!--<CheckBox Grid.Column="0" />-->
                                <Image Grid.Column="1" Height="110" Width="168" Source="images/folder2.png" />

                                <TextBlock Margin="0,0,10,0" Text="{Binding ID}" Grid.Row="0" Foreground="Black" FontSize="17" VerticalAlignment="Top" HorizontalAlignment="Left" Height="auto" FontFamily="Segoe UI Black" TextWrapping="Wrap" TextAlignment="Justify" FontWeight="SemiBold" Visibility="Collapsed"/>
                                <ScrollViewer Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Height="95" Background="{x:Null}" Margin="10,5,0,0" VerticalScrollBarVisibility="Auto">
                                    <TextBlock Margin="0,0,10,0" Text="{Binding Judul}" Grid.Row="0" Foreground="Black" FontSize="17" VerticalAlignment="Top" HorizontalAlignment="Left" Height="auto" FontFamily="Segoe UI Black" TextWrapping="Wrap" TextAlignment="Justify" FontWeight="SemiBold"/>
                                </ScrollViewer>
                            </Grid>
                        </DataTemplate>
                    </ListView.ItemTemplate>

                    <ListView.ItemContainerStyle>
                        <Style TargetType="ListViewItem">
                            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                        </Style>
                    </ListView.ItemContainerStyle>
                </ListView>

                <ListView x:Name="selectedUpdateList" Grid.Row="1" Margin="20,10,20,20"
                          AutomationProperties.AutomationId="ItemsListView"
                          AutomationProperties.Name="Items" Visibility="Collapsed"
                          ItemsSource="{Binding Source={StaticResource itemsViewSource}}"
                          HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
                          ScrollViewer.VerticalScrollBarVisibility="Visible"
                          IsSwipeEnabled="False"
                          IsItemClickEnabled="False" IsTapEnabled="False">

                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <Grid Margin="0,20,0,0" HorizontalAlignment="Stretch" Background="{x:Null}">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="auto"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>

                                <Image Grid.Column="0" Height="110" Width="168" Source="images/folder2.png" />

                                <TextBlock Margin="0,0,10,0" Text="{Binding ID}" Grid.Row="0" Foreground="Black" FontSize="17" VerticalAlignment="Top" HorizontalAlignment="Left" Height="auto" FontFamily="Segoe UI Black" TextWrapping="Wrap" TextAlignment="Justify" FontWeight="SemiBold" Visibility="Collapsed"/>
                                <Grid Grid.Column="1" Margin="10,5,0,0">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="auto"/>
                                    </Grid.RowDefinitions>

                                    <ScrollViewer Grid.Row="0" Margin="0,0,5,5" VerticalAlignment="Top" HorizontalAlignment="Left" Height="45" Background="{x:Null}" VerticalScrollBarVisibility="Auto">
                                        <TextBlock Margin="0,0,10,10" Text="{Binding Judul}" Grid.Row="0" Foreground="Black" FontSize="17" VerticalAlignment="Top" HorizontalAlignment="Left" Height="auto" FontFamily="Segoe UI Black" TextWrapping="Wrap" TextAlignment="Justify" FontWeight="SemiBold"/>
                                    </ScrollViewer>
                                </Grid>
                            </Grid>
                        </DataTemplate>
                    </ListView.ItemTemplate>

                    <ListView.ItemContainerStyle>
                        <Style TargetType="ListViewItem">
                            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                        </Style>
                    </ListView.ItemContainerStyle>
                </ListView>

代码:

try
{
    string urlPath = "http:/..../index.php/fetchupdate";
    var httpClient = new HttpClient(new HttpClientHandler());
    var values = new List<KeyValuePair<string, string>>
    {

    };

    string jsonText = await response.Content.ReadAsStringAsync();
    JsonArray jsonArray = JsonArray.Parse(jsonText);
    foreach (JsonValue groupValue in jsonArray)
    {
        JsonObject groupObject = groupValue.GetObject();
        string idfile = groupObject["idfile"].GetString();
        string judul = groupObject["judul"].GetString();

        UpdateData update = new UpdateData();
        update.ID = idfile;
        update.Judul = judul;
        DataUpate.Add(update);
    }
    updateList.ItemsSource = DataUpate;
}
catch (HttpRequestException ex)
{
    requestErrorStack.Visibility = Visibility.Visible;
}
private void UpdateList_ItemClick(object sender, ItemClickEventArgs e)
{
    if (e.ClickedItem is UpdateData selectedItem)
    {
        selectedItem.IsSelected = !selectedItem.IsSelected;
        if (selectedItem.IsSelected == true)
        {
            UpdateData selected = new UpdateData();
            selected.Judul = selectedItem.Judul;
            selected.ID = selectedItem.ID;
            selectedData.Add(selected);
        }
        else
        {
            UpdateData selected = new UpdateData();
            selected.Judul = selectedItem.Judul;
            selected.ID = selectedItem.ID;
            selectedUpdateList.Items.Remove(selected);
        }
    }
    selectedUpdateList.ItemsSource = selectedData;
}

如果在“ updateList”列表视图中单击某个项目(未选中)时使用上面的代码,则不会从“ selectedUpdateList”列表视图中删除该项目。如何处理?

1 个答案:

答案 0 :(得分:0)

  

我想如果用户单击(选择/选中)列表视图中的项目,它将转到“ selectedUpdateList”列表视图。并且,如果用户单击(未选中)列表视图中的同一项目,则该项目将从“ selectedUpdateList”列表视图中删除。

由于您未提供Minimal, Complete, and Verifiable example。我只是制作了一个简单的代码示例,即可根据您的要求实现相同的效果。

请检查以下代码示例:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition></ColumnDefinition>
        <ColumnDefinition></ColumnDefinition>
    </Grid.ColumnDefinitions>

    <ListView x:Name="updateList" ItemsSource="{Binding updateDatas}" Grid.Column="0" Margin="20,10,20,20"
                      AutomationProperties.AutomationId="ItemsListView"
                      AutomationProperties.Name="Items"
                      HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
                      ScrollViewer.VerticalScrollBarVisibility="Visible"
                      IsSwipeEnabled="False" SelectionMode="Multiple"
                      IsItemClickEnabled="True" IsMultiSelectCheckBoxEnabled="True" SelectionChanged="UpdateList_SelectionChanged">

        <ListView.ItemTemplate>
            <DataTemplate>
                <Grid Margin="0,20,0,0" HorizontalAlignment="Stretch" Background="{x:Null}">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Image Grid.Column="1" Height="110" Width="168" Source="images/folder2.png" />
                    <TextBlock Margin="0,0,10,0" Text="{Binding ID}" Grid.Row="0" Foreground="Black" FontSize="17" VerticalAlignment="Top" HorizontalAlignment="Left" Height="auto" FontFamily="Segoe UI Black" TextWrapping="Wrap" TextAlignment="Justify" FontWeight="SemiBold" Visibility="Collapsed"/>
                    <ScrollViewer Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Height="95" Background="{x:Null}" Margin="10,5,0,0" VerticalScrollBarVisibility="Auto">
                        <TextBlock Margin="0,0,10,0" Text="{Binding Judul}" Grid.Row="0" Foreground="Black" FontSize="17" VerticalAlignment="Top" HorizontalAlignment="Left" Height="auto" FontFamily="Segoe UI Black" TextWrapping="Wrap" TextAlignment="Justify" FontWeight="SemiBold"/>
                    </ScrollViewer>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>

        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            </Style>
        </ListView.ItemContainerStyle>
    </ListView>

    <ListView x:Name="selectedUpdateList" ItemsSource="{Binding selectedData}" Grid.Column="1" Margin="20,10,20,20"
                      AutomationProperties.AutomationId="ItemsListView"
                      AutomationProperties.Name="Items"
                      HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
                      ScrollViewer.VerticalScrollBarVisibility="Visible"
                      IsSwipeEnabled="False"
                      IsItemClickEnabled="False" IsTapEnabled="False">

        <ListView.ItemTemplate>
            <DataTemplate>
                <Grid Margin="0,20,0,0" HorizontalAlignment="Stretch" Background="{x:Null}">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <Image Grid.Column="0" Height="110" Width="168" Source="images/folder2.png" />

                    <TextBlock Margin="0,0,10,0" Text="{Binding ID}" Grid.Row="0" Foreground="Black" FontSize="17" VerticalAlignment="Top" HorizontalAlignment="Left" Height="auto" FontFamily="Segoe UI Black" TextWrapping="Wrap" TextAlignment="Justify" FontWeight="SemiBold" Visibility="Collapsed"/>
                    <Grid Grid.Column="1" Margin="10,5,0,0">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"/>
                        </Grid.RowDefinitions>
                        <ScrollViewer Grid.Row="0" Margin="0,0,5,5" VerticalAlignment="Top" HorizontalAlignment="Left" Height="45" Background="{x:Null}" VerticalScrollBarVisibility="Auto">
                            <TextBlock Margin="0,0,10,10" Text="{Binding Judul}" Grid.Row="0" Foreground="Black" FontSize="17" VerticalAlignment="Top" HorizontalAlignment="Left" Height="auto" FontFamily="Segoe UI Black" TextWrapping="Wrap" TextAlignment="Justify" FontWeight="SemiBold"/>
                        </ScrollViewer>
                    </Grid>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>

        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            </Style>
        </ListView.ItemContainerStyle>
    </ListView>
</Grid>
public sealed partial class MainPage : Page
{
    public ObservableCollection<UpdateData> updateDatas { get; set; }
    public ObservableCollection<UpdateData> selectedData { get; set; }
    public MainPage()
    {
        this.InitializeComponent();

        updateDatas = new ObservableCollection<UpdateData>();
        selectedData = new ObservableCollection<UpdateData>();
        for (int i=0;i<10;i++)
        {
            updateDatas.Add(new UpdateData() {ID=i,Judul="Judul "+i });
        }
        this.DataContext = this;
    }

    private void UpdateList_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        foreach (var item in e.AddedItems)
        {
            selectedData.Add((UpdateData)item);
        }
        foreach (var item in e.RemovedItems)
        {
            selectedData.Remove((UpdateData)item);
        }
    }
}

public class UpdateData
{
    public int ID { get; set; }
    public string Judul { get; set; }
}