单击图像时显示Flipview图像

时间:2017-04-26 09:31:36

标签: c# json image gridview uwp

我有一个包含一些图像的flipview,其数据是从JSON中提取的。 XAML:

<callisto:CustomDialog x:FieldModifier="public" x:Name="ListingDetail" 
                   Grid.Row="0" Grid.RowSpan="2" Title="" 
                   Background="White" BackButtonVisibility="Collapsed" BorderBrush="White" >
        <ScrollViewer Margin="0,0,5,5" Background="{x:Null}" VerticalScrollBarVisibility="Auto" HorizontalScrollMode="Disabled">
            <StackPanel Height="auto">
                <ProgressRing x:Name="listingDetailLoading" HorizontalAlignment="Center" VerticalAlignment="Center" Height="50" Width="50" />
                <StackPanel x:Name="listingDetailBox" Margin="0,0,10,10" Height="auto">
                    <Grid x:Name="listingDetailGrid" BorderBrush="#FF990000" BorderThickness="1">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                        </Grid.RowDefinitions>

                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="auto"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>

                        <TextBlock x:Name="listingIdDetail" Grid.Row="0" Text="{Binding ID}" Visibility="Collapsed"/>
                        <AppBarButton x:Name="closeListingBtn" Grid.Column="1" Icon="Clear" HorizontalAlignment="Right" Foreground="Black" Click="closeListingBtn_Click"/>
                        <FlipView x:Name="listingImageFlipview" Grid.Row="1" Grid.RowSpan="3" Grid.Column="0" Margin="20,0,0,0" ItemsSource="{Binding gallery.Items}" SelectedItem="{Binding gallery, Mode=TwoWay}" Width="230" Height="160" VerticalAlignment="Center" HorizontalAlignment="Left" BorderBrush="Black" BorderThickness="1" Background="{x:Null}">
                            <FlipView.ItemTemplate>
                                <DataTemplate>
                                    <Grid x:Name="content" Margin="0,0,0,0">
                                        <Border x:Name="coverBox" Width="230" Height="160">
                                            <Border.Background>
                                                <ImageBrush Stretch="Uniform" ImageSource="images/IP-placeholder.png"/>
                                            </Border.Background>
                                            <Image x:Name="cover" Source="{Binding ImageURL1}" HorizontalAlignment="Center" Stretch="UniformToFill" AutomationProperties.Name="{Binding ID}" ImageOpened="Image_ImageOpened" Loaded="cover_Loaded" Loading="cover_Loading"/>
                                        </Border>
                                    </Grid>
                                </DataTemplate>
                            </FlipView.ItemTemplate>
                        </FlipView>

                <StackPanel x:Name="listingFullImageDetailBox" Margin="0,0,10,10" Height="auto" Visibility="Collapsed">
                    <Grid x:Name="listingFullImageDetailGrid" BorderBrush="#FF990000" BorderThickness="1">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>

                        <AppBarButton x:Name="closeListingFullImageBtn" Grid.Column="1" Icon="Clear" HorizontalAlignment="Right" Foreground="Black" Click="closeListingFullImageBtn_Click"/>
                        <FlipView x:Name="listingImageFullFlipview" Grid.Row="1" Grid.RowSpan="3" Grid.Column="0" Margin="20,0,0,0" ItemsSource="{Binding gallery.Items}" SelectedItem="{Binding gallery, Mode=TwoWay}" Width="230" Height="160" VerticalAlignment="Center" HorizontalAlignment="Left" BorderBrush="Black" BorderThickness="1" Background="{x:Null}" Tapped="listingImageFullFlipview_Tapped">
                            <FlipView.ItemTemplate>
                                <DataTemplate>
                                    <Grid x:Name="content" Margin="0,0,0,0">
                                        <Border x:Name="coverBox" Width="230" Height="160">
                                            <Border.Background>
                                                <ImageBrush Stretch="Uniform" ImageSource="images/IP-placeholder.png"/>
                                            </Border.Background>
                                            <Image x:Name="cover" Source="{Binding ImageURL1}" HorizontalAlignment="Center" Stretch="UniformToFill" AutomationProperties.Name="{Binding ID}" ImageOpened="Image_ImageOpened" Loaded="cover_Loaded" Loading="cover_Loading"/>
                                        </Border>
                                    </Grid>
                                </DataTemplate>
                            </FlipView.ItemTemplate>
                        </FlipView>
                    </Grid>
                </StackPanel>
            </StackPanel>
        </ScrollViewer>
    </callisto:CustomDialog>

代码:

    private async void itemGridView_ItemClick(object sender, ItemClickEventArgs e)
            {
                ListingDetail.IsOpen = true;
                listingItemDetail = e.ClickedItem as ListingClass;
                listingIdDetail.Text = listingItemDetail.ID.ToString();


                ConnectionProfile connections = NetworkInformation.GetInternetConnectionProfile();
                if (connections != null && connections.GetNetworkConnectivityLevel() == NetworkConnectivityLevel.InternetAccess)
                {
                    listingDetailLoading.IsActive = true;
                    try
                    {
                        string urlPath = "http://indonesia-product.com/api/v1/listings/" + listingIdDetail.Text + ".json?module=listings&page=1&token=3f63-dc43-c8d5-eb45-8cbf-b72d-9d98-800f";
                        var httpClient = new HttpClient(new HttpClientHandler());

                        var values = new List<KeyValuePair<string, string>>
                        {

                        };

                        HttpResponseMessage response = await httpClient.GetAsync(urlPath);
                        response.EnsureSuccessStatusCode();

                        if (!response.IsSuccessStatusCode)
                        {
                            listingDetailLoading.IsActive = false;
                            RequestException();
                        }

                        string jsonText = await response.Content.ReadAsStringAsync();
                        JsonObject jsonObject = JsonObject.Parse(jsonText);
                        JsonObject jsonData = jsonObject["data"].GetObject();

                        JsonObject groupObject1 = jsonData.GetObject();


JsonArray jsonGallery = groupObject1["gallery"].GetArray();
                        ObservableCollection<ListingClass> imageinfos = new ObservableCollection<ListingClass>();
                        foreach (JsonValue groupValue1 in jsonGallery)
                        {
                            JsonObject groupObject3 = groupValue1.GetObject();

                            string imageUrl = groupObject3.ContainsKey("image_url") && groupObject3["image_url"] != null ? groupObject3["image_url"].GetString() : string.Empty;

                            ListingClass info = new ListingClass();
                            info.ImageURL1 = new BitmapImage(new Uri(imageUrl));
                            imageinfos.Add(info);
                        }
                        listingImageFlipview.ItemsSource = imageinfos;

ListingClass file = new ListingClass();

                    file.ID = Convert.ToInt32(id);
                        }
                        catch (Exception exception)
                        {
                            // TODO show error (video uri not found)    
                        }

                        listingDetailBox.Visibility = Visibility.Visible;
                        listingDetailLoading.Visibility = Visibility.Collapsed;
                        listingDetailLoading.IsActive = false;
                    }
                    catch (HttpRequestException ex)
                    {
                        listingDetailLoading.IsActive = false;
                    }
                }
                else
                {
                    listingDetailLoading.IsActive = false;
                }
            }

    private async void listingImageFullFlipview_Tapped(object sender, TappedRoutedEventArgs e)
            {
                listingFullImageDetailBox.Visibility = Visibility.Visible;
                try
                {
                    string urlPath = "http://indonesia-product.com/api/v1/listings/" + listingIdDetail.Text + ".json?module=listings&page=1&token=3f63-dc43-c8d5-eb45-8cbf-b72d-9d98-800f";
                    //Debug.WriteLine(urlPath.ToString());
                    var httpClient = new HttpClient(new HttpClientHandler());

                    var values = new List<KeyValuePair<string, string>>
                    {

                    };

                    HttpResponseMessage response = await httpClient.GetAsync(urlPath);
                    response.EnsureSuccessStatusCode();

                    if (!response.IsSuccessStatusCode)
                    {
                        listingDetailLoading.IsActive = false;
                        RequestException();
                    }

                    string jsonText = await response.Content.ReadAsStringAsync();
                    JsonObject jsonObject = JsonObject.Parse(jsonText);
                    JsonObject jsonData = jsonObject["data"].GetObject();

                    JsonObject groupObject1 = jsonData.GetObject();

                    JsonArray jsonGallery = groupObject1["gallery"].GetArray();
                    ObservableCollection<ListingClass> imageinfos = new ObservableCollection<ListingClass>();
                    foreach (JsonValue groupValue1 in jsonGallery)
                    {
                        JsonObject groupObject3 = groupValue1.GetObject();

                        string imageUrl = groupObject3.ContainsKey("image_url") && groupObject3["image_url"] != null ? groupObject3["image_url"].GetString() : string.Empty;

                        ListingClass info = new ListingClass();
                        info.ImageURL1 = new BitmapImage(new Uri(imageUrl));
                        imageinfos.Add(info);
                    }
                    listingImageFullFlipview.ItemsSource = imageinfos;
                }
                catch (HttpRequestException ex)
                {
                    listingDetailLoading.IsActive = false;
                }
            }

我想在点击flipview上的图像时,它会在自定义对话框中的flipview上显示图像。如何申请?

0 个答案:

没有答案