Skip to content

[Experiment] Initial CompositionCollectionView implementation and basic samples #277

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 54 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
54 commits
Select commit Hold shift + click to select a range
d1b9aa1
CompositionCollectionView port and basic sample
arcadiogarcia Jul 7, 2022
8a959a9
Samples
arcadiogarcia Jul 8, 2022
7cfe44d
Maze WIP
arcadiogarcia Sep 5, 2022
6e9dcb6
Merge branch 'main' of https://github.com/CommunityToolkit/Labs-Windo…
arcadiogarcia Sep 5, 2022
61be6d3
CCV project
arcadiogarcia Sep 5, 2022
028c635
Merge branch 'feature/compositionCollectionView' into feature/composi…
arcadiogarcia Sep 6, 2022
11a1a43
Fix maze layout
arcadiogarcia Sep 6, 2022
d9b54e3
Sample text
arcadiogarcia Sep 8, 2022
c63d0a4
Generic model
arcadiogarcia Sep 12, 2022
7ebb3aa
Cleanup
arcadiogarcia Sep 12, 2022
27c94d4
Restore file from master
arcadiogarcia Sep 12, 2022
1304e6c
Disable code for non-UWP targets
arcadiogarcia Sep 19, 2022
252b5be
Adjust colors
arcadiogarcia Sep 19, 2022
efb3d1f
Fix z index
arcadiogarcia Sep 19, 2022
7df0634
Fix xaml styling
arcadiogarcia Sep 19, 2022
0dbd25e
Address PR feedback
arcadiogarcia Sep 22, 2022
218ee1c
Break down layout file
arcadiogarcia Sep 22, 2022
885cf60
Report last state of interaction trackers + fix animatable nodes repo…
arcadiogarcia Oct 27, 2022
cd5c508
WIP
arcadiogarcia Oct 27, 2022
b3ddd06
Fix sample
arcadiogarcia Oct 27, 2022
86406e6
Increase version
arcadiogarcia Oct 27, 2022
39d744e
Remove IsUserInteracting property
arcadiogarcia Oct 28, 2022
7c1774a
WIp
arcadiogarcia Oct 30, 2022
fa5cc2b
Fix transition bug
arcadiogarcia Nov 1, 2022
d55fb2b
Run xaml styler
arcadiogarcia Nov 1, 2022
437667a
Cleanup element when deleted
arcadiogarcia Nov 3, 2022
cdd5aff
Expose composer value in animatable nodes
arcadiogarcia Nov 4, 2022
3846011
Configure each of the sub ITBs in ElementInteractionTrackerBehavior
arcadiogarcia Nov 8, 2022
bb0ef5d
Address Dispose warning
arcadiogarcia Nov 9, 2022
0de0f1e
Merge branch 'main' of https://github.com/CommunityToolkit/Labs-Windo…
arcadiogarcia Nov 9, 2022
5f7a680
Ignore "not implemented in Uno" warnings
arcadiogarcia Nov 9, 2022
c0826a3
Add missing Scale reference to Evaluate
arcadiogarcia Nov 11, 2022
bf1d7e6
Make add/removebehavior methods public
arcadiogarcia Nov 14, 2022
78bd506
Improve Evaluate not implemented error messages and implement Length()
arcadiogarcia Nov 18, 2022
75661bc
Merge branch 'main' into feature/compositionCollectionView2
Arlodotexe Dec 8, 2022
635fb6d
Updated with project changes from #327
Arlodotexe Dec 8, 2022
e8720e2
Merge branch 'main' into feature/compositionCollectionView2
Arlodotexe Dec 21, 2022
5f128fb
Updated with project changes from #330
Arlodotexe Dec 21, 2022
8d28c32
Added missing discussion-id and issue-id to front matter
Arlodotexe Dec 21, 2022
d582d29
Merge branch 'main' into feature/compositionCollectionView2
Arlodotexe Feb 23, 2023
840e331
Migrating to new component folder layout
Arlodotexe Feb 23, 2023
b194ba7
Merge branch 'main' into feature/compositionCollectionView2
Arlodotexe Feb 24, 2023
9aae744
Fixed compilation errors for tests
Arlodotexe Feb 24, 2023
c06af8c
Fixed compilation errors
Arlodotexe Feb 24, 2023
05c6051
Merged with local changes
arcadiogarcia Mar 10, 2023
790fdd0
Remove extra shared project
arcadiogarcia Mar 10, 2023
8bac431
Fix lerp implementation & compile error
arcadiogarcia Mar 10, 2023
5421485
Merge branch 'main' into feature/compositionCollectionView2
Arlodotexe Mar 11, 2023
fdc41d6
Merge fix
Arlodotexe Mar 11, 2023
9c2a469
Address feedback
arcadiogarcia Mar 11, 2023
6a0b6c0
Fix styling
arcadiogarcia Mar 11, 2023
4024c1a
Merge branch 'main' into feature/compositionCollectionView2
Arlodotexe Mar 13, 2023
5929330
Add missing globalusing
Arlodotexe Mar 13, 2023
6f978ed
Update components/CompositionCollectionView/samples/CanvasSample.cs
Arlodotexe May 27, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion Windows.Toolkit.Common.props
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@
<Copyright>(c) .NET Foundation and Contributors. All rights reserved.</Copyright>
<PackageProjectUrl>https://github.com/CommunityToolkit/Labs-Windows</PackageProjectUrl>
<PackageReleaseNotes>https://github.com/CommunityToolkit/Labs-Windows/releases</PackageReleaseNotes>
<PackageIcon>Icon.png</PackageIcon>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's some other non-needed changes here and in the common\test projects

<PackageIconUrl>https://raw.githubusercontent.com/CommunityToolkit/Labs-Windows/main/nuget.png</PackageIconUrl>
<!-- TODO: Remove when closing https://github.com/CommunityToolkit/Labs-Windows/issues/256 -->
<NoWarn>$(NoWarn);NU1505;NU1504</NoWarn>
Expand Down
102 changes: 56 additions & 46 deletions common/GlobalUsings_WinUI.cs
Original file line number Diff line number Diff line change
@@ -1,46 +1,56 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.

// This file contains directives available to projects that are compiled for multiple frameworks.
// Learn more global using directives at https://docs.microsoft.com/dotnet/csharp/language-reference/keywords/using-directive#global-modifier

global using System.Runtime.InteropServices.WindowsRuntime;

global using Windows.Foundation;
global using Windows.Foundation.Collections;

#if !WINAPPSDK
global using Windows.ApplicationModel;
global using Windows.ApplicationModel.Activation;

global using Windows.UI.Xaml.Automation;
global using Windows.UI.Xaml.Automation.Peers;

global using Windows.UI.Xaml;
global using Windows.UI.Xaml.Controls;
global using Windows.UI.Xaml.Controls.Primitives;
global using Windows.UI.Xaml.Data;
global using Windows.UI.Xaml.Input;
global using Windows.UI.Xaml.Markup;
global using Windows.UI.Xaml.Media;
global using Windows.UI.Xaml.Media.Animation;
global using Windows.UI.Xaml.Navigation;

#else

global using Microsoft.UI.Xaml.Automation;
global using Microsoft.UI.Xaml.Automation.Peers;

global using Microsoft.UI.Xaml;
global using Microsoft.UI.Xaml.Controls;
global using Microsoft.UI.Xaml.Controls.Primitives;
global using Microsoft.UI.Xaml.Data;
global using Microsoft.UI.Xaml.Input;
global using Microsoft.UI.Xaml.Markup;
global using Microsoft.UI.Xaml.Media;
global using Microsoft.UI.Xaml.Media.Animation;
global using Microsoft.UI.Xaml.Navigation;
#endif

global using MUXC = Microsoft.UI.Xaml.Controls;
// Licensed to the .NET Foundation under one or more agreements.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changes here are going to be a problem/conflict with the work we're doing for #405 and #398. Should just tie-in to clean up needed for #321?

// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.

// This file contains directives available to projects that are compiled for multiple frameworks.
// Learn more global using directives at https://docs.microsoft.com/dotnet/csharp/language-reference/keywords/using-directive#global-modifier

global using System.Runtime.InteropServices.WindowsRuntime;

global using Windows.Foundation;
global using Windows.Foundation.Collections;

#if !WINAPPSDK
global using Windows.ApplicationModel;
global using Windows.ApplicationModel.Activation;

global using Windows.UI.Xaml.Automation;
global using Windows.UI.Xaml.Automation.Peers;

global using Windows.UI.Xaml;
global using Windows.UI.Xaml.Controls;
global using Windows.UI.Xaml.Controls.Primitives;
global using Windows.UI.Xaml.Data;
global using Windows.UI.Xaml.Input;
global using Windows.UI.Xaml.Markup;
global using Windows.UI.Xaml.Media;
global using Windows.UI.Xaml.Media.Animation;
global using Windows.UI.Xaml.Navigation;

global using Windows.UI.Composition;
global using Windows.UI.Composition.Interactions;
global using Windows.UI.Xaml.Hosting;

#else

global using Microsoft.UI.Xaml.Automation;
global using Microsoft.UI.Xaml.Automation.Peers;

global using Microsoft.UI.Xaml;
global using Microsoft.UI.Xaml.Controls;
global using Microsoft.UI.Xaml.Controls.Primitives;
global using Microsoft.UI.Xaml.Data;
global using Microsoft.UI.Xaml.Input;
global using Microsoft.UI.Xaml.Markup;
global using Microsoft.UI.Xaml.Media;
global using Microsoft.UI.Xaml.Media.Animation;
global using Microsoft.UI.Xaml.Navigation;

global using Microsoft.UI.Composition;
global using Microsoft.UI.Composition.Interactions;
global using Microsoft.UI.Xaml.Hosting;
global using Microsoft.UI;

#endif

global using MUXC = Microsoft.UI.Xaml.Controls;
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<Project ToolsVersion="15.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
<Import Project="$([MSBuild]::GetPathOfFileAbove(directory.build.props))" Condition="Exists('$([MSBuild]::GetPathOfFileAbove(directory.build.props))')" />

<Import Project="$(RepositoryDirectory)common\MultiTarget\TargetFrameworks.props" />
<PropertyGroup>
<IsDeployableHead>true</IsDeployableHead>
Expand All @@ -24,21 +23,18 @@
<Import Project="$(RepositoryDirectory)common\MultiTarget\ProjectIdentifiers.props" />
<Import Project="$(RepositoryDirectory)common\ProjectHeads\Tests.Head.Uwp.props" />
<Import Project="$(RepositoryDirectory)common\ProjectHeads\AllComponents\Tests.Head.AllComponents.props" />

<PropertyGroup>
<ProjectGuid>{FD78002E-C4E6-4BF8-9EC3-C06250DFEF34}</ProjectGuid>
<RootNamespace>CommunityToolkit.Tests</RootNamespace>
<AssemblyName>CommunityToolkit.Tests.Uwp</AssemblyName>
<UnitTestPlatformVersion Condition="'$(UnitTestPlatformVersion)' == ''">$(VisualStudioVersion)</UnitTestPlatformVersion>
</PropertyGroup>

<ItemGroup>
<Content Include="Properties\Default.rd.xml" />
<AppxManifest Include="Package.appxmanifest">
<SubType>Designer</SubType>
</AppxManifest>
</ItemGroup>

<!-- Must be imported after any shared projects in non-sdk style projects -->
<Import Project="$(MSBuildExtensionsPath)\Microsoft\WindowsXaml\v$(VisualStudioVersion)\Microsoft.Windows.UI.Xaml.CSharp.targets" />
</Project>
</Project>
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<Project ToolsVersion="15.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
<Import Project="$([MSBuild]::GetPathOfFileAbove(directory.build.props))" Condition="Exists('$([MSBuild]::GetPathOfFileAbove(directory.build.props))')" />

<Import Project="$(RepositoryDirectory)common\MultiTarget\TargetFrameworks.props" />
<PropertyGroup>
<IsDeployableHead>true</IsDeployableHead>
Expand All @@ -24,7 +23,6 @@
<Import Project="$(RepositoryDirectory)common\MultiTarget\ProjectIdentifiers.props" />
<Import Project="$(RepositoryDirectory)common\ProjectHeads\App.Head.Uwp.props" />
<Import Project="$(RepositoryDirectory)common\MultiTarget\Generated\*.props" />

<PropertyGroup>
<RootNamespace>CommunityToolkit.App.Uwp</RootNamespace>
<AssemblyName>CommunityToolkit.App.Uwp</AssemblyName>
Expand Down
3 changes: 3 additions & 0 deletions components/CompositionCollectionView/OpenSolution.bat
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
@ECHO OFF

powershell ..\..\common\ProjectHeads\GenerateSingleSampleHeads.ps1 -componentPath %CD% %*
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Binary file not shown.
19 changes: 19 additions & 0 deletions components/CompositionCollectionView/samples/BasicSample.xaml
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<Page x:Class="CompositionCollectionView.Sample.BasicSample"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:labs="using:CommunityToolkit.Labs.WinUI"
xmlns:local="using:CompositionCollectionView.Sample"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<StackPanel>
<Button x:Name="addButton"
Margin="10">
Add element
</Button>
<labs:CompositionCollectionView x:Name="compositionCollectionView"
Width="600"
Height="200" />
</StackPanel>
</Page>
83 changes: 83 additions & 0 deletions components/CompositionCollectionView/samples/BasicSample.xaml.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using CommunityToolkit.Labs.WinUI;
using Microsoft.Toolkit.Uwp.UI.Animations.ExpressionsFork;
using System.Xml.Linq;

#if !WINAPPSDK
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Composition;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using Windows.UI.Xaml.Shapes;
#else
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Controls.Primitives;
using Microsoft.UI.Xaml.Data;
using Microsoft.UI.Xaml.Input;
using Microsoft.UI.Xaml.Media;
using Microsoft.UI.Xaml.Navigation;
#endif

namespace CompositionCollectionView.Sample
{
[ToolkitSample(id: nameof(BasicSample), "Simple layout", description: "Displaying elements in a simple layout.")]
public sealed partial class BasicSample : Page
{
public BasicSample()
{
this.InitializeComponent();

var elements = new Dictionary<uint, object?>()
{
{ 0, null },
{ 1, null },
{ 2, null },
{ 3, null },
{ 4, null }
};
#if !WINAPPSDK

var layout = new SampleLayout((id) =>
new Rectangle()
{
Width = 100,
Height = 100,
Fill = new SolidColorBrush(Windows.UI.Colors.CornflowerBlue)
});
compositionCollectionView.SetLayout(layout);
compositionCollectionView.UpdateSource(elements);

addButton.Click += (object sender, RoutedEventArgs e) =>
{
elements.Add((uint)elements.Count, null);
compositionCollectionView.UpdateSource(elements);
};
#endif
}

#if !WINAPPSDK
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Bit confused by these conditionals in the samples, there's no comment, why is this excluded on the WindowsAppSDK?

public class SampleLayout : CompositionCollectionLayout<uint, object?>
{
public SampleLayout(Func<uint, FrameworkElement> elementFactory) : base(elementFactory)
{
}

public override Vector3Node GetElementPositionNode(ElementReference<uint, object?> element)
{
return ExpressionFunctions.Vector3(element.Id * 120, 0, 0);
}

public override ScalarNode GetElementScaleNode(ElementReference<uint, object?> element) => 1;
}
#endif
}
}
97 changes: 97 additions & 0 deletions components/CompositionCollectionView/samples/CanvasSample.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
// Licensed to the .NET Foundation under one or more agreements.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This file should be CanvasSample.xaml.cs no?

// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
using CommunityToolkit.Labs.WinUI;
using Microsoft.Toolkit.Uwp.UI.Animations.ExpressionsFork;
using System.Numerics;
using System.Xml.Linq;

#if !WINAPPSDK
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Composition;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using Windows.UI.Xaml.Shapes;
#else
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Controls.Primitives;
using Microsoft.UI.Xaml.Data;
using Microsoft.UI.Xaml.Input;
using Microsoft.UI.Xaml.Media;
using Microsoft.UI.Xaml.Navigation;
#endif

namespace CompositionCollectionView.Sample
{
[ToolkitSample(id: nameof(CanvasSample), "Canvas layout", description: "Displays elements in a 2d canvas, animating between updates.")]
public sealed partial class CanvasSample : Page
{
public CanvasSample()
{
this.InitializeComponent();

#if !WINAPPSDK
var elements = new Dictionary<uint, Vector2>()
{
{ 0, Vector2.Zero },
{ 1, Vector2.Zero },
{ 2, Vector2.Zero },
{ 3, Vector2.Zero },
{ 4, Vector2.Zero }
};

var layout = new CanvasLayout((id) =>
new Rectangle()
{
Width = 100,
Height = 100,
Fill = new SolidColorBrush(Windows.UI.Colors.CornflowerBlue),
Stroke = new SolidColorBrush(Colors.Gray),
StrokeThickness = 1
});

compositionCollectionView.SetLayout(layout);
compositionCollectionView.UpdateSource(elements);

rearrangeButton.Click += (object sender, RoutedEventArgs e) =>
{
var rnd = new Random();

for(uint i =0; i< elements.Count; i++)
{
elements[i] = new Vector2(
(float)(rnd.NextDouble() * compositionCollectionView.ActualWidth),
(float)(rnd.NextDouble() * compositionCollectionView.ActualHeight));
}
compositionCollectionView.UpdateSource(elements);
};
#endif
}

#if !WINAPPSDK
public class CanvasLayout : CompositionCollectionLayout<uint, Vector2>
{
public CanvasLayout(Func<uint, FrameworkElement> elementFactory) : base(elementFactory)
{
}

public override Vector3Node GetElementPositionNode(ElementReference<uint, Vector2> element)
{
return new Vector3(element.Model.X, element.Model.Y, 0);
}

protected override ElementTransition GetElementTransitionEasingFunction(ElementReference<uint, Vector2> element) =>
new(200,
Window.Current.Compositor.CreateCubicBezierEasingFunction(new Vector2(0.25f, 0.1f), new Vector2(0.25f, 1f)));
}
#endif
}
}
19 changes: 19 additions & 0 deletions components/CompositionCollectionView/samples/CanvasSample.xaml
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<Page x:Class="CompositionCollectionView.Sample.CanvasSample"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:labs="using:CommunityToolkit.Labs.WinUI"
xmlns:local="using:CompositionCollectionView.Sample"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<StackPanel>
<Button x:Name="rearrangeButton"
Margin="10">
Rearrange
</Button>
<labs:CompositionCollectionView x:Name="compositionCollectionView"
Width="600"
Height="600" />
</StackPanel>
</Page>
Loading