我有一个包含一些图像的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上显示图像。如何申请?