Update the connected animations sample to use the photos source so it's more realistic of what a user would do.

This commit is contained in:
Shawn Kendrot 2020-04-17 15:53:21 -06:00
Родитель 068faf491f
Коммит bd648388b3
4 изменённых файлов: 44 добавлений и 39 удалений

Просмотреть файл

@ -6,7 +6,7 @@
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations"
xmlns:data="using:Microsoft.Toolkit.Uwp.SampleApp.Models"
xmlns:data="using:Microsoft.Toolkit.Uwp.SampleApp.Data"
mc:Ignorable="d">
<Grid Padding="40">
@ -37,11 +37,13 @@
animations:Connected.ListItemElementName="ItemThumbnail"
animations:Connected.ListItemKey="listItem">
<GridView.ItemTemplate>
<DataTemplate x:DataType="data:Item">
<StackPanel>
<Border x:Name="ItemThumbnail" Background="Purple" Height="200" Width="200"></Border>
<TextBlock Text="{x:Bind Title}"></TextBlock>
</StackPanel>
<DataTemplate x:DataType="data:PhotoDataItem">
<Grid Height="200" Width="200">
<Image x:Name="ItemThumbnail" Source="{Binding Thumbnail}" Stretch="UniformToFill"></Image>
<Border Background="#99FFFFFF" VerticalAlignment="Bottom" Padding="5">
<TextBlock Text="{x:Bind Title}" FontSize="14"></TextBlock>
</Border>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>

Просмотреть файл

@ -3,51 +3,39 @@
// See the LICENSE file in the project root for more information.
using System.Collections.Generic;
using System.Collections.ObjectModel;
using Microsoft.Toolkit.Uwp.SampleApp.Data;
using Microsoft.Toolkit.Uwp.SampleApp.Models;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Media.Animation;
using Windows.UI.Xaml.Navigation;
namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages.ConnectedAnimations.Pages
{
public sealed partial class SecondPage : Page
{
private static List<Item> items;
private static ObservableCollection<PhotoDataItem> items;
public SecondPage()
{
this.InitializeComponent();
if (items == null)
{
items = new List<Item>
{
new Item() { Title = "Test 1" },
new Item() { Title = "Test 2" },
new Item() { Title = "Test 3" },
new Item() { Title = "Test 4" },
new Item() { Title = "Test 5" },
new Item() { Title = "Test 6" },
new Item() { Title = "Test 7" },
new Item() { Title = "Test 8" },
new Item() { Title = "Test 9" },
new Item() { Title = "Test 10" },
new Item() { Title = "Test 11" },
new Item() { Title = "Test 12" },
new Item() { Title = "Test 13" },
new Item() { Title = "Test 14" },
new Item() { Title = "Test 15" },
new Item() { Title = "Test 16" },
new Item() { Title = "Test 17" },
new Item() { Title = "Test 18" }
};
}
listView.ItemsSource = items;
}
private void ListView_ItemClick(object sender, ItemClickEventArgs e)
{
Frame.Navigate(typeof(ThirdPage), e.ClickedItem, new SuppressNavigationTransitionInfo());
}
protected async override void OnNavigatedTo(NavigationEventArgs e)
{
base.OnNavigatedTo(e);
if (items == null)
{
items = await new Data.PhotosDataSource().GetItemsAsync();
}
listView.ItemsSource = items;
}
}
}

Просмотреть файл

@ -18,10 +18,10 @@
<TextBlock Text="{x:Bind item.Title}" FontSize="50"></TextBlock>
<TextBlock TextWrapping="WrapWholeWords">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eleifend ex sit amet blandit lobortis. Curabitur ut diam fringilla, interdum massa sit amet, facilisis erat. Donec vulputate sed ex vel pellentesque. In sodales odio non felis interdum viverra. Morbi in mi mollis, ullamcorper nibh sit amet, sagittis ex. Maecenas dapibus commodo venenatis. Donec at egestas est.</TextBlock>
</StackPanel>
<Border x:Name="ItemHeroElement"
<Image x:Name="ItemHeroElement"
Height="300" Width="300"
Background="Purple"
animations:Connected.Key="listItem"></Border>
Source="{x:Bind item.Thumbnail}"
animations:Connected.Key="listItem"></Image>
</StackPanel>
<TextBlock x:Name="Content" Margin="0,40" TextWrapping="WrapWholeWords" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eleifend ex sit amet blandit lobortis. Curabitur ut diam fringilla, interdum massa sit amet, facilisis erat. Donec vulputate sed ex vel pellentesque. In sodales odio non felis interdum viverra. Morbi in mi mollis, ullamcorper nibh sit amet, sagittis ex. Maecenas dapibus commodo venenatis. Donec at egestas est. Donec sit amet ante gravida, feugiat arcu quis, ullamcorper justo. Donec finibus erat lectus, pretium ultrices erat lobortis eu. Nulla sodales libero nisi, a varius urna vehicula et. In rhoncus magna sed felis ultricies aliquet. Sed rhoncus mi id elementum faucibus. Fusce blandit, urna sit amet maximus ultrices, lorem neque fermentum felis, id elementum tellus erat eu eros. Vivamus egestas, est eu sagittis vehicula, lorem nulla hendrerit elit, eu consectetur leo magna eu lorem. Nulla pulvinar augue vitae libero pretium molestie. Nam eget dui velit. Curabitur eu vehicula velit, eu convallis orci. Interdum et malesuada fames ac ante ipsum primis in faucibus. Vestibulum et ipsum turpis. Ut volutpat condimentum elit, sit amet faucibus libero dignissim ac. Aenean vitae euismod lorem. Cras enim neque, hendrerit et dui vitae, viverra porttitor nisi. Aliquam suscipit dictum leo id consequat. Pellentesque condimentum elementum neque. Donec hendrerit nisi quis lorem sagittis, et aliquam dui suscipit. Cras at ligula vitae magna dignissim condimentum nec sagittis mauris. In hac habitasse platea dictumst. Donec tempor, dui et pretium pretium, libero magna iaculis eros, sed consequat nisi orci tempus est. Fusce in rutrum odio. Donec vitae porta metus, et pellentesque turpis. Nullam vestibulum lacus a metus sollicitudin vestibulum. Quisque lacinia quam et urna iaculis mattis. Vestibulum in justo ligula. Donec in dolor lacinia, semper risus eget, bibendum libero. Phasellus elementum odio vel facilisis gravida. Aliquam ac rutrum lacus, et aliquam arcu. Sed tempor rhoncus ipsum, nec viverra diam suscipit non. Nam fermentum commodo auctor. Praesent et nunc id nibh dignissim interdum. Phasellus fermentum mauris tortor, vel laoreet leo maximus sed. Nam sagittis risus lacinia quam dictum rutrum. Pellentesque mollis elit vel mauris eleifend auctor. Donec nec tincidunt odio. Morbi eleifend, turpis ullamcorper convallis vehicula, eros enim lobortis sapien, sit amet consequat risus lorem eu ligula. Quisque hendrerit scelerisque justo vel ultricies. Duis nec erat vulputate, sagittis nisi ut, congue tellus. Integer eget risus nec justo rutrum gravida. Sed eu aliquam nisl, consectetur euismod lacus. Etiam erat ligula, laoreet sed risus non, auctor sollicitudin lacus. Ut tincidunt lectus nec tempor interdum. Proin varius nisi enim, sed finibus urna tincidunt et. Suspendisse venenatis ex ut risus porttitor tempor. Vestibulum mauris ante, blandit in bibendum ac, aliquet quis leo. Aenean at facilisis nunc. Nullam blandit erat at orci tincidunt, in iaculis lorem viverra. Maecenas nec dui porta, tempus nulla nec, rhoncus felis. Ut vitae lectus a metus varius pretium at ut enim. Suspendisse potenti.</TextBlock>

Просмотреть файл

@ -2,7 +2,10 @@
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using Microsoft.Toolkit.Uwp.SampleApp.Data;
using Microsoft.Toolkit.Uwp.SampleApp.Models;
using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Navigation;
@ -10,16 +13,28 @@ namespace Microsoft.Toolkit.Uwp.SampleApp.SamplePages.ConnectedAnimations.Pages
{
public sealed partial class ThirdPage : Page
{
private Item item;
private PhotoDataItem item;
public ThirdPage()
{
Loaded += OnLoaded;
this.InitializeComponent();
}
private void OnLoaded(object sender, RoutedEventArgs e)
{
}
protected override void OnApplyTemplate()
{
base.OnApplyTemplate();
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
item = e.Parameter as Item;
item = e.Parameter as PhotoDataItem;
base.OnNavigatedTo(e);
}
}