从 StackPanel C# UWP 中选择图像(将动作侦听器添加到 UIElement 并将图像添加到 UIElement)

Posted

技术标签:

【中文标题】从 StackPanel C# UWP 中选择图像(将动作侦听器添加到 UIElement 并将图像添加到 UIElement)【英文标题】:Selecting image from StackPanel C# UWP (Adding action listener to UIElement and Image to UIElement) 【发布时间】:2017-10-09 07:51:22 【问题描述】:

我正在使用 C# 并且正在创建 UWP 应用程序。 我正在使用 Windons.Ui.Xaml.Controls.Image 并且我创建了列出我的图像的以下代码

UxHelpers.DispatchToASTAThread(
async () =>

    imageIndex++;
    StackPanel stackPanel = new StackPanel();
    stackPanel.Children.Add(image);           

this.Results.Children.Add(stackPanel);
 ).Forget();

这是在for循环中,我希望当用户点击某个图像时能够保存它。

我有保存代码,我只是不知道如何为每个图像添加鼠标侦听器,以便在我将鼠标移到图像上时对其进行标记(因此用户知道通过单击它会发生某些事情)以及何时他点击我希望它用这个图片索引调用我的函数....

我查看了 UIElement,但仍然无法弄清楚。

谢谢!!

【问题讨论】:

【参考方案1】:

我们可以将PointerEntered 事件添加到Image 控件,当用户将鼠标移到它上面时,我们可以更改UI。然后我们可以在Image控件中添加Tapped事件,如果用户点击它就会被触发。

要获取Image的索引,我们可以将索引设置为ImageName属性。

例如:

protected override async void OnNavigatedTo(NavigationEventArgs e)

    StackPanel stackPanel = new StackPanel();
    for (int i = 0; i < 3; i++)
    
        Windows.Storage.Streams.IRandomAccessStream random = await Windows.Storage.Streams.RandomAccessStreamReference.CreateFromUri(new Uri("ms-appx:///Assets/sun2set.jpg")).OpenReadAsync();
        Image image = new Image();
        BitmapImage bitmapImage = new BitmapImage();
        StackPanel mystackPanel = new StackPanel();
        image.Name = i.ToString();
        bitmapImage.SetSource(random);
        image.Source = bitmapImage;
        mystackPanel.Children.Add(image);
        image.PointerEntered += Image_PointerEntered;
        image.PointerExited += Image_PointerExited;
        stackPanel.Children.Add(mystackPanel);
    
    this.Results.Children.Add(stackPanel);


private void Image_PointerExited(object sender, PointerRoutedEventArgs e)

    var image = sender as Image;

    var parent = VisualTreeHelper.GetParent(image) as StackPanel;
    parent.BorderBrush = new SolidColorBrush(Colors.Red);
    parent.BorderThickness = new Thickness(0);
    image.Tapped -= Image_Tapped;


private void Image_PointerEntered(object sender, PointerRoutedEventArgs e)

    var image = sender as Image;
    Debug.WriteLine("The" + image.Name + "is Selected!");
    var parent = VisualTreeHelper.GetParent(image) as StackPanel;
    parent.BorderBrush = new SolidColorBrush(Colors.Red);
    parent.BorderThickness = new Thickness(5);
    image.Tapped += Image_Tapped;


private void Image_Tapped(object sender, TappedRoutedEventArgs e)

    var image = sender as Image;
    //download the image

【讨论】:

以上是关于从 StackPanel C# UWP 中选择图像(将动作侦听器添加到 UIElement 并将图像添加到 UIElement)的主要内容,如果未能解决你的问题,请参考以下文章

如何在 UWP c# 中用 DataTable 内容填充 DataGrid

UWP开发小结

如何将使用 InkCanvas 在画布上完成的工作保存到 UWP C# 中的图像文件?

UWP ItemsControl 内容不像 WPF 中那样拉伸

自定义选择器 C# UWP 上的多项选择

UWP C# 将 png 转换为 pdf