Skip to content

Commit 4c477be

Browse files
friedcucumberfriedcucumber
committed
KanbanView example added
1 parent 8a80f8a commit 4c477be

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

47 files changed

+2580
-0
lines changed

‎CS/SingleColumnKanbanView/CS/App.xaml

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
2+
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
3+
xmlns:windows="clr-namespace:Microsoft.Maui.Controls.PlatformConfiguration.WindowsSpecific;assembly=Microsoft.Maui.Controls"
4+
xmlns:local="clr-namespace:DataGridDragDrop"
5+
x:Class= "DataGridDragDrop.App"
6+
windows:Application.ImageDirectory="Assets">
7+
<Application.Resources>
8+
<Color x:Key="Primary">#6750A4</Color>
9+
<Color x:Key="Gray50">#F2F2F7</Color>
10+
<Color x:Key="Gray100">#E1E1E1</Color>
11+
<Color x:Key="Gray200">#C8C8C8</Color>
12+
<Color x:Key="Gray300">#ACACAC</Color>
13+
<Color x:Key="Gray400">#919191</Color>
14+
<Color x:Key="Gray500">#6E6E6E</Color>
15+
<Color x:Key="Gray600">#404040</Color>
16+
<Color x:Key="Gray900">#212121</Color>
17+
<Color x:Key="Gray950">#141414</Color>
18+
<Color x:Key="NormalText">#55575c</Color>
19+
<Color x:Key="NormalHeaderText">#55575c</Color>
20+
<Color x:Key="NormalLightText">#959aa0</Color>
21+
<Color x:Key="TitleTextColor">White</Color>
22+
<Color x:Key="NormalBackgroundColor">White</Color>
23+
<Style TargetType="NavigationPage">
24+
<Setter Property="BarBackgroundColor" Value="{StaticResource Primary}" />
25+
<Setter Property="BarTextColor" Value="White" />
26+
</Style>
27+
<Style TargetType="Shell" ApplyToDerivedTypes="True">
28+
<Setter Property="Shell.BackgroundColor" Value="{StaticResource Primary}" />
29+
<Setter Property="Shell.TitleColor" Value="White" />
30+
</Style>
31+
</Application.Resources>
32+
</Application>

‎CS/SingleColumnKanbanView/CS/App.xaml.cs

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
namespace DataGridDragDrop {
2+
public partial class App : Application {
3+
public App() {
4+
InitializeComponent();
5+
6+
MainPage = new AppShell();
7+
}
8+
}
9+
}

‎CS/SingleColumnKanbanView/CS/AppShell.xaml

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<?xml version="1.0" encoding="utf-8" ?>
2+
<Shell xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
3+
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
4+
x:Class="DataGridDragDrop.AppShell"
5+
xmlns:local="clr-namespace:DataGridDragDrop"
6+
Title="AppShell">
7+
<ShellContent ContentTemplate="{DataTemplate local:MainPage}" Title="Project Board"/>
8+
</Shell>

‎CS/SingleColumnKanbanView/CS/AppShell.xaml.cs

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
namespace DataGridDragDrop;
2+
3+
public partial class AppShell : Shell {
4+
public AppShell()
5+
{
6+
InitializeComponent();
7+
}
8+
}

‎CS/SingleColumnKanbanView/CS/Converters.cs

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Globalization;
4+
using System.Linq;
5+
using System.Text;
6+
using System.Threading.Tasks;
7+
8+
namespace DataGridDragDrop {
9+
public class ImportanceToColorConverter : IValueConverter {
10+
public object Convert(object value, Type targetType, object parameter, CultureInfo culture) {
11+
if (value == null)
12+
return null;
13+
TaskToDoPriority taskPriority = (TaskToDoPriority)value;
14+
switch (taskPriority) {
15+
case TaskToDoPriority.Low:
16+
return Color.FromArgb("#8fa3ad");
17+
case TaskToDoPriority.Medium:
18+
return Color.FromArgb("#3BB540");
19+
case TaskToDoPriority.High:
20+
return Color.FromArgb("#e57373");
21+
}
22+
return null;
23+
}
24+
25+
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) {
26+
throw new NotImplementedException();
27+
}
28+
}
29+
}

‎CS/SingleColumnKanbanView/CS/DataGridDragDrop.csproj

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
<Project Sdk="Microsoft.NET.Sdk">
2+
3+
<PropertyGroup>
4+
<TargetFrameworks>net7.0-ios;net7.0-android</TargetFrameworks>
5+
<OutputType>Exe</OutputType>
6+
<UseMaui>true</UseMaui>
7+
<ImplicitUsings>enable</ImplicitUsings>
8+
<SingleProject>true</SingleProject>
9+
<RootNamespace>DataGridDragDrop</RootNamespace>
10+
11+
<!-- Display name -->
12+
<ApplicationTitle>Drag Drop</ApplicationTitle>
13+
14+
<!-- App Identifier -->
15+
<ApplicationId>com.companyname.DataGridDragDrop</ApplicationId>
16+
<ApplicationIdGuid>4929E67D-A42B-4831-9947-BAC31A114BCB</ApplicationIdGuid>
17+
<!-- Versions -->
18+
<ApplicationDisplayVersion>1.0</ApplicationDisplayVersion>
19+
<ApplicationVersion>1</ApplicationVersion>
20+
21+
<SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'ios'">14.2</SupportedOSPlatformVersion>
22+
<SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'android'">21.0</SupportedOSPlatformVersion>
23+
<UseInterpreter Condition="$(TargetFramework.Contains('-ios')) AND '$(Configuration)' == 'Release'">True</UseInterpreter>
24+
</PropertyGroup>
25+
<ItemGroup>
26+
<!-- App Icon -->
27+
<MauiIcon Include="Resources\AppIcon\appicon.svg" ForegroundFile="Resources\AppIcon\appiconfg.svg" Color="#6750A4" />
28+
29+
<!-- Splash Screen -->
30+
<MauiSplashScreen Include="Resources\Splash\splash.svg" Color="#6750A4" BaseSize="128,128" />
31+
32+
<!-- Images -->
33+
<MauiImage Include="Resources\Images\*" />
34+
35+
<!-- Custom Fonts -->
36+
<MauiFont Include="Resources\Fonts\*" />
37+
</ItemGroup>
38+
39+
40+
<ItemGroup>
41+
<PackageReference Include="DevExpress.Maui.CollectionView" Version="22.2.3" />
42+
<PackageReference Include="DevExpress.Maui.Core" Version="22.2.3" />
43+
<PackageReference Include="DevExpress.Maui.DataGrid" Version="22.2.3" />
44+
<TrimmableAssembly Include="DevExpress.Data.v22.2" />
45+
</ItemGroup>
46+
47+
48+
<ItemGroup>
49+
<MauiXaml Update="AppShell.xaml">
50+
<Generator>MSBuild:Compile</Generator>
51+
</MauiXaml>
52+
</ItemGroup>
53+
</Project>

‎CS/SingleColumnKanbanView/CS/DataGridDragDrop.sln

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
2+
Microsoft Visual Studio Solution File, Format Version 12.00
3+
# Visual Studio Version 17
4+
VisualStudioVersion = 17.4.33122.133
5+
MinimumVisualStudioVersion = 10.0.40219.1
6+
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "DataGridDragDrop", "DataGridDragDrop.csproj", "{B232764E-43F2-427D-9A78-BA5B39A9A626}"
7+
EndProject
8+
Global
9+
GlobalSection(SolutionConfigurationPlatforms) = preSolution
10+
Debug|Any CPU = Debug|Any CPU
11+
Release|Any CPU = Release|Any CPU
12+
EndGlobalSection
13+
GlobalSection(ProjectConfigurationPlatforms) = postSolution
14+
{B232764E-43F2-427D-9A78-BA5B39A9A626}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
15+
{B232764E-43F2-427D-9A78-BA5B39A9A626}.Debug|Any CPU.Build.0 = Debug|Any CPU
16+
{B232764E-43F2-427D-9A78-BA5B39A9A626}.Debug|Any CPU.Deploy.0 = Debug|Any CPU
17+
{B232764E-43F2-427D-9A78-BA5B39A9A626}.Release|Any CPU.ActiveCfg = Release|Any CPU
18+
{B232764E-43F2-427D-9A78-BA5B39A9A626}.Release|Any CPU.Build.0 = Release|Any CPU
19+
EndGlobalSection
20+
GlobalSection(SolutionProperties) = preSolution
21+
HideSolutionNode = FALSE
22+
EndGlobalSection
23+
GlobalSection(ExtensibilityGlobals) = postSolution
24+
SolutionGuid = {56EE3A97-D769-40ED-9789-C4E134417DCF}
25+
EndGlobalSection
26+
EndGlobal

‎CS/SingleColumnKanbanView/CS/GettingStarted.txt

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
Welcome to DevExpress Components for .NET MAUI! Here are a few tips to help you get started with your new application.
2+
3+
DevExpress NuGet Feed
4+
---------------------
5+
6+
DevExpress Components for .NET MAUI are free-of-charge. To learn more about our free offer and reserve your free copy,
7+
please visit the following webpage: https://www.devexpress.com/mobile-xamarin-maui-free/
8+
9+
IMPORTANT: You MUST register your personal NuGet package source for the solution to build correctly.
10+
After you reserved your free copy, you can use the following page to obtain a NuGet Feed URL: https://nuget.devexpress.com/
11+
12+
If you are unfamiliar with NuGet packages, please review the following
13+
help topic (Install DevExpress Controls Using NuGet Packages): https://docs.devexpress.com/GeneralInformation/115912/
14+
15+
QuickStart Guide
16+
----------------
17+
18+
See the following topic to learn more about DevExpress Components for .NET MAUI: https://docs.devexpress.com/MAUI

‎CS/SingleColumnKanbanView/CS/MainPage.xaml

+67
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
2+
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
3+
xmlns:dxcv="clr-namespace:DevExpress.Maui.CollectionView;assembly=DevExpress.Maui.CollectionView"
4+
xmlns:ios="clr-namespace:Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;assembly=Microsoft.Maui.Controls"
5+
xmlns:dxg="clr-namespace:DevExpress.Maui.DataGrid;assembly=DevExpress.Maui.DataGrid"
6+
xmlns:dxc="clr-namespace:DevExpress.Maui.Controls;assembly=DevExpress.Maui.Controls"
7+
xmlns:local="clr-namespace:DataGridDragDrop"
8+
ios:Page.UseSafeArea="true"
9+
x:Class= "DataGridDragDrop.MainPage">
10+
<ContentPage.Resources>
11+
<local:ImportanceToColorConverter x:Key="importanceToColorConverter"/>
12+
</ContentPage.Resources>
13+
<dxg:DataGridView ItemsSource="{Binding Tasks}" IsColumnHeaderVisible="False" SelectionMode="None" BackgroundColor="{AppThemeBinding Light={StaticResource Gray50}, Dark=#141414}"
14+
AllowDragDropRows="True" AllowDragDropSortedRows="True" AllowGroupCollapse="False"
15+
CustomSort="DataGridView_CustomSort" CustomGroup="DataGridView_CustomGroup"
16+
CompleteRowDragDrop="DataGridView_CompleteRowDragDrop"
17+
DragRow="DataGridView_DragRow" x:Name="dataGrid">
18+
<dxg:DataGridView.GroupRowAppearance>
19+
<dxg:GroupRowAppearance HorizontalLineThickness="0" BackgroundColor="{AppThemeBinding Light=#F1F1F1, Dark=#141414}" />
20+
</dxg:DataGridView.GroupRowAppearance>
21+
<dxg:DataGridView.CellAppearance>
22+
<dxg:CellAppearance BackgroundColor="{AppThemeBinding Light={StaticResource Gray50}, Dark=#141414}" HorizontalLineThickness="0"/>
23+
</dxg:DataGridView.CellAppearance>
24+
<dxg:DataGridView.GroupRowTemplate>
25+
<DataTemplate>
26+
<Label Text="{Binding Value}" Margin="20,15,0,0" FontSize="14" TextColor="{AppThemeBinding Light={StaticResource Gray500}, Dark={StaticResource Gray300}}" FontAttributes="Bold"/>
27+
</DataTemplate>
28+
</dxg:DataGridView.GroupRowTemplate>
29+
<dxg:TextColumn FieldName="Stage" IsGrouped="True" SortMode="Custom"/>
30+
<dxg:TemplateColumn FieldName="Title">
31+
<dxg:TemplateColumn.DisplayTemplate>
32+
<DataTemplate>
33+
<Grid>
34+
<Border IsVisible="False" StrokeShape="RoundRectangle 8,8,8,8" BackgroundColor="{AppThemeBinding Light=White, Dark={StaticResource Gray900}}" Margin="10,5,10,5" StrokeThickness="0">
35+
<Grid RowDefinitions="Auto,Auto, Auto" ColumnDefinitions="*,Auto">
36+
<Border StrokeShape="RoundRectangle 6,6,6,6" BackgroundColor="{Binding Item.Priority, Converter={StaticResource importanceToColorConverter}}" HeightRequest="8" WidthRequest="60" Margin="10,4,10,0" HorizontalOptions="Start"/>
37+
<dxc:SimpleButton Icon="verticaldots" BackgroundColor="{AppThemeBinding Light=White, Dark={StaticResource Gray900}}" IconColor="{StaticResource Gray300}" Clicked="SimpleButton_Clicked" Padding="0,10,0,0" WidthRequest="30" VerticalOptions="End" Grid.Column="1"/>
38+
<Label Text="{Binding Item.Title}" TextColor="{AppThemeBinding Light={StaticResource Gray600}, Dark={StaticResource Gray200}}" FontSize="14" Margin="10,0,10,0" Grid.Row="1"/>
39+
<Border StrokeShape="RoundRectangle 5,5,5,5" BackgroundColor="{AppThemeBinding Light=#eceff1, Dark=#919191}}" HorizontalOptions="Start" VerticalOptions="End" Margin="10,14,10,14" Grid.Row="2">
40+
<Label FontSize="12" Text="{Binding Item.DueDate, StringFormat='&#x1F552; {0:m}'}" Margin="6,0,10,0" HeightRequest="22" VerticalTextAlignment="Center" VerticalOptions="Center"/>
41+
</Border>
42+
<Image Source="{Binding Item.AssigneePhotoPath}" WidthRequest="32" HeightRequest="32" Grid.Column="1" Grid.Row="2" Margin="18,6,20,10" VerticalOptions="Start">
43+
<Image.Clip>
44+
<EllipseGeometry RadiusX="16" RadiusY="16" Center="16,16"/>
45+
</Image.Clip>
46+
</Image>
47+
</Grid>
48+
<Border.Triggers>
49+
<DataTrigger Binding="{Binding Item.IsPlaceholder}" Value="False" TargetType="Border">
50+
<Setter Property="IsVisible" Value="True"/>
51+
</DataTrigger>
52+
</Border.Triggers>
53+
</Border>
54+
<Border IsVisible="False" BackgroundColor="Transparent">
55+
<Label Text="Drag Items here" Margin="10,20,10,20" HorizontalOptions="Center"/>
56+
<Border.Triggers>
57+
<DataTrigger Binding="{Binding Item.IsPlaceholder}" Value="True" TargetType="Border">
58+
<Setter Property="IsVisible" Value="True"/>
59+
</DataTrigger>
60+
</Border.Triggers>
61+
</Border>
62+
</Grid>
63+
</DataTemplate>
64+
</dxg:TemplateColumn.DisplayTemplate>
65+
</dxg:TemplateColumn>
66+
</dxg:DataGridView>
67+
</ContentPage>

‎CS/SingleColumnKanbanView/CS/MainPage.xaml.cs

+49
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
using DevExpress.Maui.DataGrid;
2+
using System.Runtime.CompilerServices;
3+
4+
namespace DataGridDragDrop {
5+
public partial class MainPage : ContentPage {
6+
MainViewModel viewModel;
7+
TaskToDo draggedItem;
8+
string draggedTaskOriginalStage;
9+
10+
public MainPage() {
11+
InitializeComponent();
12+
BindingContext = viewModel = new MainViewModel();
13+
}
14+
15+
private void DataGridView_CustomSort(object sender, DevExpress.Maui.DataGrid.CustomSortEventArgs e) {
16+
if (e.Column.FieldName == "Stage")
17+
e.Result = Comparer<int>.Default.Compare(viewModel.StageOrder[(string)e.Value1], viewModel.StageOrder[(string)e.Value2]);
18+
}
19+
private void DataGridView_CustomGroup(object sender, DevExpress.Maui.DataGrid.CustomGroupEventArgs e) {
20+
if (e.Column.FieldName == "Stage")
21+
e.GroupsEqual = (string)e.Value1 == (string)e.Value2;
22+
}
23+
private void DataGridView_CompleteRowDragDrop(object sender, DevExpress.Maui.DataGrid.CompleteRowDragDropEventArgs e) {
24+
AddPlaceholderTaskToSourceGroup();
25+
RemovePlaceholderTaskFromTargetGroup();
26+
}
27+
private void DataGridView_DragRow(object sender, DevExpress.Maui.DataGrid.DragRowEventArgs e) {
28+
draggedItem = (TaskToDo)e.DragItem;
29+
e.Cancel = draggedItem.IsPlaceholder;
30+
draggedTaskOriginalStage = draggedItem.Stage;
31+
}
32+
void AddPlaceholderTaskToSourceGroup() {
33+
if (!viewModel.Tasks.Any(t => t.Stage == draggedTaskOriginalStage)) {
34+
viewModel.Tasks.Add(new TaskToDo() { IsPlaceholder = true, Stage = draggedTaskOriginalStage });
35+
}
36+
}
37+
void RemovePlaceholderTaskFromTargetGroup() {
38+
string newDraggedTaskStage = draggedItem.Stage;
39+
TaskToDo stabTask = viewModel.Tasks.FirstOrDefault(t => t.Stage == newDraggedTaskStage && t.IsPlaceholder);
40+
if (stabTask != null) {
41+
viewModel.Tasks.Remove(stabTask);
42+
}
43+
}
44+
45+
private async void SimpleButton_Clicked(object sender, EventArgs e) {
46+
await DisplayAlert("Tip", "Tap and hold a row to drag it", "OK");
47+
}
48+
}
49+
}

‎CS/SingleColumnKanbanView/CS/MainViewModel.cs

+56
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Collections.ObjectModel;
4+
using System.Linq;
5+
using System.Text;
6+
using System.Threading.Tasks;
7+
8+
namespace DataGridDragDrop {
9+
public class MainViewModel {
10+
public Dictionary<string, int> StageOrder = new Dictionary<string, int>() { { "Planned", 0 }, { "Coding", 1 }, { "Testing", 2 }, { "Done", 3 } };
11+
public ObservableCollection<TaskToDo> Tasks { get; set; }
12+
public MainViewModel() {
13+
Tasks = DataStorage.CreateTasks();
14+
}
15+
}
16+
public class TaskToDo {
17+
18+
public TaskToDo() { }
19+
public TaskToDo(string title, DateTime dueDate, string stage, TaskToDoPriority priority, string assigneePhotoPath) {
20+
Title = title;
21+
DueDate = dueDate;
22+
Stage = stage;
23+
Priority = priority;
24+
AssigneePhotoPath= assigneePhotoPath;
25+
}
26+
public string Title { get; set; }
27+
public DateTime DueDate { get; set; }
28+
public string Stage { get; set; }
29+
public TaskToDoPriority Priority { get; set; }
30+
public string AssigneePhotoPath { get; set; }
31+
public bool IsPlaceholder { get; set; }
32+
}
33+
public enum TaskToDoPriority {
34+
High,
35+
Medium,
36+
Low,
37+
}
38+
public static class DataStorage {
39+
public static ObservableCollection<TaskToDo> CreateTasks() {
40+
return new ObservableCollection<TaskToDo>() {
41+
new TaskToDo("Single Vertical Scrollbar for Multiple Views", DateTime.Now.AddDays(18), "Testing", TaskToDoPriority.Low, "albertmenendez.jpg"),
42+
new TaskToDo("App UI Manager - FreeLayout for WidgetView", DateTime.Now.AddDays(20), "Done", TaskToDoPriority.Low, "alexjames.jpg"),
43+
new TaskToDo("Office Inspired Animations", DateTime.Now.AddDays(20), "Done", TaskToDoPriority.Low, "alfrednewman.jpg"),
44+
new TaskToDo("Scheduler Control - Agenda View", DateTime.Now.AddDays(1), "Planned", TaskToDoPriority.High, "frankfrankson.jpg"),
45+
new TaskToDo("Mail Demo Redesign", DateTime.Now.AddDays(1), "Planned", TaskToDoPriority.Low, "benjaminjohonson.jpg"),
46+
new TaskToDo("New Splash Screen Design", DateTime.Now.AddDays(2), "Planned", TaskToDoPriority.Medium, "albertmenendez.jpg"),
47+
new TaskToDo("New TreeMap Control", DateTime.Now.AddDays(5), "Testing", TaskToDoPriority.High, "bobbievalentine.jpg"),
48+
new TaskToDo("PictureEdit - Trim Image by Mask/Shape", DateTime.Now.AddDays(6), "Doing", TaskToDoPriority.Medium, "frankfrankson.jpg"),
49+
new TaskToDo("NavBar and Office Navigation Bar", DateTime.Now.AddDays(10), "Doing", TaskToDoPriority.High, "jennievalintine.jpg"),
50+
new TaskToDo("SVG Icons", DateTime.Now.AddDays(11), "Doing", TaskToDoPriority.High, "frankfrankson.jpg"),
51+
new TaskToDo("New TreeMap Control", DateTime.Now.AddDays(15), "Testing", TaskToDoPriority.High, "karenholmes.jpg"),
52+
new TaskToDo("Data Form and Editor AutoFocus", DateTime.Now.AddDays(17), "Testing", TaskToDoPriority.Medium, "jennievalintine.jpg"),
53+
};
54+
}
55+
}
56+
}

0 commit comments

Comments
 (0)