WinUI3 and Drag and Drop - drag-and-drop

I am trying to get Drag and Drop working with WinUI3. In WPF I used to add added both AllowDrop and Drop to a UI element and I was able to receive the filename of a dropped file. However in WinUI3 the method Drop is not beeing executed. What am I doing wrong?
XAML
<Page
x:Class="..."
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="..."
xmlns:helper="..."
xmlns:prop="..."
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Page.Resources>
<DataTemplate x:Key="Image" x:DataType="helper:ProductImage">
<Border BorderBrush="{x:Bind Path=Color, Mode=OneWay}" BorderThickness="1" Background="Transparent"
AllowDrop="True" Drop="Image_Drop" >
<Grid Width="{Binding ElementName=PIImageSize, Path=Value}"
Height="{Binding ElementName=PIImageSize, Path=Value}" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Margin="2" HorizontalAlignment="Center"
Text="{x:Bind Path=Type, Mode=OneWay}"
Foreground="{x:Bind Path=Color, Mode=OneWay}" />
<Image Grid.Row="1" Stretch="Uniform" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Source="{x:Bind Path=BitmapImage, Mode=OneWay}"/>
<TextBox Grid.Row="2" Text="{x:Bind Path=Path, Mode=TwoWay}" />
</Grid>
<Border.ContextFlyout>
</Border.ContextFlyout>
</Border>
</DataTemplate>
</Page.Resources>
...
</Page>
Code
private void Image_Drop(object sender, DragEventArgs e)
{
// Function is not executed
}

You also have to add the DragOver event, to accept the operation:
private void Image_DragOver(object sender, DragEventArgs e)
{
e.AcceptedOperation = Windows.ApplicationModel.DataTransfer.DataPackageOperation.Copy;
}

Related

how to bind popup page button to viewmodel command property in xamarin forms

I'm new to MVVM and xamarin forms. I want to implement custom popup in mvvm and following is my code
My Viewmodel is:
public class PopupVM
{
public ICommand CancelCommand => new Command(async () =>{await
Application.Current.MainPage.Navigation.PopModalAsync();});
}
My Popuppage Xaml:`
<pages:PopupPage.Animation>
<animations:ScaleAnimation DurationIn="400"
DurationOut="300"
EasingIn="SinOut"
EasingOut="SinIn"
HasBackgroundAnimation="True"
PositionIn="Center"
PositionOut="Center"
ScaleIn="1.2"
ScaleOut="0.8" />
</pages:PopupPage.Animation>
<Grid Margin="12"
Padding="24"
BackgroundColor="White"
HorizontalOptions="Center"
VerticalOptions="Center">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<StackLayout Orientation="Vertical">
<Picker Grid.Row="0" Grid.Column="0">
<Picker.Items>
<x:String>....</x:String>
</Picker.Items>
</Picker>
<StackLayout Orientation="Vertical" Grid.Column="0" Grid.Row="1">
<StackLayout Orientation="Horizontal" >
<Label Text="A"/>**strong text**
<Picker>
<Picker.Items>
<x:String>Item1</x:String>
<x:String>Item2</x:String>
<x:String>Item3</x:String>
</Picker.Items>
</Picker>
</StackLayout>
<StackLayout Orientation="Horizontal" >
<Label Text="B"/>
<Picker>
<Picker.Items>
<x:String>....</x:String>
</Picker.Items>
</Picker>
</StackLayout>
<StackLayout Orientation="Horizontal" >
<Label Text="C"/>
<Picker>
<Picker.Items>
<x:String>....</x:String>
</Picker.Items>
</Picker>
</StackLayout>
</StackLayout>
<Button Text="Ok"/>
<Button Text="Cancel" x:Name="cnclBtn" />
</StackLayout>
</Grid>
My Popupxaml.cs page is:
public partial class MyPopupPage
{
static PopupVM vm;
public MyPopupPage ()
{
InitializeComponent ();
if (vm==null)
{ vm = new PopupVM(); }
BindingContext = vm;
}
}
I'm not getting where im making mistake. and also i need custom popup not the default display alert
<Button Text="Cancel" x:Name="cnclBtn" Command="{binding CancelCommand}" />
For more info with commands and binding go to this

Telerik Xamarin RadListView weird behavior

In Xamarin Forms (Portable) project when I place RadlistView in first page I got binded list which not render template in Android. I not checked other platforms. In this case the RadListView in second page is rendered ok.
First page with RadListView
Second page with RadListView
But if I replace radlistview in first page with Xamarin.Forms.ListView, it showed normal but in the second page RadListView showed without template.
The first page with Xamarin ListView
Second page with RadListView losted template
First page code below :
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Name="Page"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:telerikPrimitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"
xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:viewmodels="clr-namespace:InRestoApp.ViewModels"
xmlns:behaviors="clr-namespace:InRestoApp.Behaviors"
xmlns:helpers="clr-namespace:InRestoApp.Helpers"
x:Class="InRestoApp.Views.HallsPage">
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness">
<On Platform="iOS" Value="10, 20, 10, 0" />
<On Platform="Android, UWP" Value="10, 0" />
</OnPlatform>
</ContentPage.Padding>
<ContentPage.Resources>
<helpers:InvertBoolConverter x:Key="invertBoolConverter"/>
</ContentPage.Resources>
<Grid HeightRequest="800">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<telerikDataControls:RadListView x:Name="ItemsListView" SelectionMode="Single" HeightRequest="800"
ItemsSource="{Binding Halls}"
ItemTapped="ListView_OnItemTapped">
<telerikDataControls:RadListView.LayoutDefinition>
<telerikListView:ListViewLinearLayout VerticalItemSpacing="0" />
</telerikDataControls:RadListView.LayoutDefinition>
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<Frame CornerRadius="5" HasShadow="True" OutlineColor="#4488F6" Padding="10" Margin="10">
<StackLayout Orientation="Horizontal">
<Label Text="{Binding HallCode}" FontSize="Large" VerticalOptions="StartAndExpand" />
<Label Text="{Binding HallName}" FontSize="Medium" VerticalOptions="CenterAndExpand" />
</StackLayout>
</Frame>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</Grid>
</ContentPage>
Second view XAML below (Used ContentView because it is openening as slide drawer)
<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:flv="clr-namespace:DLToolkit.Forms.Controls;assembly=DLToolkit.Forms.Controls.FlowListView"
xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
xmlns:helpers="clr-namespace:InRestoApp.Helpers"
xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"
xmlns:telerikInput="clr-namespace:Telerik.XamarinForms.Input;assembly=Telerik.XamarinForms.Input"
x:Name="productView"
x:Class="InRestoApp.Views.ProductsView">
<ContentView.Resources>
<helpers:ImageBytesConverter x:Key="imageBytesConverter"/>
<helpers:TempConverter x:Key="tempConverter"/>
<helpers:ImageFileToImageSourceConverter x:Key="imageFileToImageSourceConverter"/>
</ContentView.Resources>
<ContentView.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="4*"/>
<ColumnDefinition Width="6*"/>
</Grid.ColumnDefinitions>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Frame CornerRadius="2" HasShadow="True" OutlineColor="Aquamarine" Padding="10" Margin="2">
<Image x:Name="btnClear" Source="clear_icon.png" HeightRequest="50" WidthRequest="50" >
<Image.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Path=BindingContext.ClearProductsFilterCommand, Source={x:Reference productView}}" CommandParameter="{Binding .}" />
</Image.GestureRecognizers>
</Image>
</Frame>
<telerikDataControls:RadListView x:Name="CategoriesListView" Grid.Row="1" SelectedItem="{Binding SelectedProductCategory, Mode=TwoWay}" SelectionMode="Single"
ItemsSource="{Binding ProductCategories}">
<telerikDataControls:RadListView.LayoutDefinition>
<telerikListView:ListViewLinearLayout VerticalItemSpacing="0" />
</telerikDataControls:RadListView.LayoutDefinition>
<!--<telerikDataControls:RadListView.ItemStyle>
<telerikListView:ListViewItemStyle BackgroundColor="Transparent" BorderLocation="None"/>
</telerikDataControls:RadListView.ItemStyle>-->
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<Frame CornerRadius="10" HasShadow="True" OutlineColor="#4488F6" Padding="10" Margin="10" >
<StackLayout Orientation="Horizontal">
<StackLayout>
<ffimageloading:CachedImage HeightRequest="70" Aspect="AspectFill" WidthRequest="70" Margin="5"
DownsampleHeight="70" DownsampleUseDipUnits="false"
LoadingPlaceholder="image_loading.png" ErrorPlaceholder="image_error.png"
Source="{Binding FileName, Converter={StaticResource imageFileToImageSourceConverter}}"/>
<Label Text="{Binding ProductCategoryName}" FontSize="Medium" VerticalOptions="CenterAndExpand" />
</StackLayout>
</StackLayout>
</Frame>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</Grid>
<telerikDataControls:RadListView x:Name="ProductsListView" Grid.Column="1" SelectedItem="{Binding SelectedProduct, Mode=TwoWay}" SelectionMode="Single"
ItemsSource="{Binding Products}">
<telerikDataControls:RadListView.LayoutDefinition>
<telerikListView:ListViewLinearLayout VerticalItemSpacing="0" />
</telerikDataControls:RadListView.LayoutDefinition>
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<Frame CornerRadius="10" HasShadow="True" OutlineColor="#4488F6" Margin="5" HeightRequest="110" >
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="70"/>
<RowDefinition Height="20"/>
<RowDefinition Height="20"/>
</Grid.RowDefinitions>
<ffimageloading:CachedImage HeightRequest="70" Aspect="AspectFit" WidthRequest="70" Margin="2"
DownsampleHeight="50" DownsampleUseDipUnits="false"
LoadingPlaceholder="image_loading.png" ErrorPlaceholder="image_error.png"
Source="{Binding FileName, Converter={StaticResource imageFileToImageSourceConverter}}"/>
<Label Text="{Binding RestProductNameEntity.ProductName}" FontSize="Medium" VerticalOptions="CenterAndExpand" Grid.Row="1" />
<telerikInput:RadNumericInput Value="{Binding Quantity, Mode=TwoWay}" Grid.Row="2" HeightRequest="20" />
</Grid>
</Frame>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</Grid>
</ContentView.Content>
</ContentView>
c# file not providing because it used web api from another project, also using dummy source has same effect. As source used
ObservableCollection
I forgot add that before issue I updated Telerik Xamarin platform. After clean solution, deleting bin and obj folders and rebild project it solved.

MVVM, using Multiple DataSets and Multiple ComboBoxes tied to each other

I have a single Database EstimateInformationTable with CATEGORY, DESCRIPTION. 100 records total. There are 100 Descriptions and 10 Categories, so obviously the Categories are used more than once.
example:
+----------+-------------+
| CATEGORY | DESCRIPTION |
+----------+-------------+
| ACC | DescAAAA |
| ACC | DescBBBB |
| BMX | DescCCCC |
+----------+-------------+
I want to use the first ComboBox (CATEGORY) to limit the choices in the second ComboBox (DESCRIPTION).
I have two ComboBoxes bound to two DataSet TableAdaptors. Each TableAdaptor returns a simple, but different Schema.
ComboBox1:
SELECT DISTINCT CATEGORY
FROM EstimateInformationTable
ORDER BY CATEGORY
ComboBox2:
SELECT DESCRIPTION
FROM EstimateInformationTable
WHERE (CATEGORY = #Category)
ORDER BY DESCRIPTION
I can kind of get this to work in CodeBehind using an extra ButtonClickEvent, but obviously this is not ultimately what I want.
I want to use MVVM and the correct Notify Properties (if that is what needs to be done) so that changing the Category ComboBox updates the Description ComboBox.
This must be done all the time, but I am new to a lot of this. I was making progress, but I am having a hard time wrapping my head around this. This is a self imposed learning exercise, so feel free to dumb the explanation down for me. Thanks, mike
XAML:
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:gobo.Pages"
xmlns:gobo="clr-namespace:gobo" x:Class="gobo.Pages.TESTSTUFF01"
xmlns:vm="clr-namespace:gobo.ViewModel"
mc:Ignorable="d"
Title="TESTSTUFF01" Loaded="Page_Loaded">
<Page.Resources>
<vm:CategoryChangedViewModel x:Key="CategoryChangedViewModel"/>
<gobo:gobo2018DataSet1 x:Key="gobo2018DataSet1"/>
<CollectionViewSource x:Key="estimateInformationTableViewSource" Source="{Binding EstimateInformationTable, Source={StaticResource gobo2018DataSet1}}"/>
<gobo:gobo2018EstimateInformationTableDescriptionDataSet x:Key="gobo2018EstimateInformationTableDescriptionDataSet"/>
<CollectionViewSource x:Key="estimateInformationTableViewSource1" Source="{Binding EstimateInformationTable, Source={StaticResource gobo2018EstimateInformationTableDescriptionDataSet}}"/>
</Page.Resources>
<Page.Background>
<LinearGradientBrush EndPoint="0.5,1" MappingMode="RelativeToBoundingBox" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="Red" Offset="1"/>
</LinearGradientBrush>
</Page.Background>
<StackPanel Orientation="Vertical" >
<Label Content="TEST STUFF 01 Tab Page1" VerticalAlignment="Top" Background="{x:Null}"/>
<Button Content="Change Description contents" Click="Button_Click"/>
<Grid x:Name="grid1" DataContext="{StaticResource estimateInformationTableViewSource}" HorizontalAlignment="Left" VerticalAlignment="Top">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Label Content="CATEGORY:" Grid.Column="0" HorizontalAlignment="Left" Margin="3" Grid.Row="0" VerticalAlignment="Center"/>
<ComboBox x:Name="cATEGORYComboBox" Grid.Column="1" DisplayMemberPath="CATEGORY" HorizontalAlignment="Left" Height="Auto" Margin="3" Grid.Row="0" VerticalAlignment="Center" Width="120"
ItemsSource="{Binding}"
SelectedIndex="{Binding Category, Source={StaticResource CategoryChangedViewModel}}">
<ComboBox.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel/>
</ItemsPanelTemplate>
</ComboBox.ItemsPanel>
</ComboBox>
</Grid>
<Grid x:Name="grid2" DataContext="{StaticResource estimateInformationTableViewSource1}" HorizontalAlignment="Left" VerticalAlignment="Top" Width="311">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Label Content="DESCRIPTION:" Grid.Column="0" HorizontalAlignment="Left" Margin="3" Grid.Row="0" VerticalAlignment="Center"/>
<ComboBox x:Name="dESCRIPTIONComboBox" Grid.Column="1" DisplayMemberPath="DESCRIPTION" HorizontalAlignment="Left" Height="Auto" ItemsSource="{Binding}" Margin="3,9,-53,9" Grid.Row="0" VerticalAlignment="Center" Width="180">
<ComboBox.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel/>
</ItemsPanelTemplate>
</ComboBox.ItemsPanel>
</ComboBox>
</Grid>
</StackPanel>
</Page>
CurrentCodeBehind
namespace gobo.Pages
{
/// <summary>
/// Interaction logic for TESTSTUFF01.xaml
/// </summary>
public partial class TESTSTUFF01 : Page
{
private gobo.gobo2018DataSet1 gobo2018DataSet1;
public gobo.gobo2018DataSet1TableAdapters.EstimateInformationTableTableAdapter gobo2018DataSet1TableAdapter;
private CollectionViewSource estimateInformationTableViewSource;
private gobo.gobo2018EstimateInformationTableDescriptionDataSet gobo2018EstimateInformationTableDescriptionDataSet;
private gobo.gobo2018EstimateInformationTableDescriptionDataSetTableAdapters.EstimateInformationTableTableAdapter EstimateInformationTableTableAdapter;
private CollectionViewSource estimateInformationTableViewSource1;
public TESTSTUFF01()
{
InitializeComponent();
}
private void Page_Loaded(object sender, RoutedEventArgs e)
{
gobo2018DataSet1 = ((gobo.gobo2018DataSet1)(this.FindResource("gobo2018DataSet1")));
gobo2018DataSet1TableAdapter = new gobo.gobo2018DataSet1TableAdapters.EstimateInformationTableTableAdapter();
gobo2018DataSet1TableAdapter.Fill(gobo2018DataSet1.EstimateInformationTable);
estimateInformationTableViewSource = ((System.Windows.Data.CollectionViewSource)(this.FindResource("estimateInformationTableViewSource")));
estimateInformationTableViewSource.View.MoveCurrentToFirst();
gobo2018EstimateInformationTableDescriptionDataSet = ((gobo.gobo2018EstimateInformationTableDescriptionDataSet)(this.FindResource("gobo2018EstimateInformationTableDescriptionDataSet")));
EstimateInformationTableTableAdapter = new gobo.gobo2018EstimateInformationTableDescriptionDataSetTableAdapters.EstimateInformationTableTableAdapter();
EstimateInformationTableTableAdapter.FillByCategory(gobo2018EstimateInformationTableDescriptionDataSet.EstimateInformationTable,"ACC");
estimateInformationTableViewSource1 = ((System.Windows.Data.CollectionViewSource)(this.FindResource("estimateInformationTableViewSource1")));
estimateInformationTableViewSource1.View.MoveCurrentToFirst();
}
public void LoadDescriptionToCbo(String parameter)
{
if(gobo2018EstimateInformationTableDescriptionDataSet != null)
{
EstimateInformationTableTableAdapter.FillByCategory(gobo2018EstimateInformationTableDescriptionDataSet.EstimateInformationTable, parameter);
}
}
private void Button_Click(object sender, RoutedEventArgs e)
{
LoadDescriptionToCbo("ACT");
Console.WriteLine("Button Click -> LoadDescriptionToCode");
}
}
}
I've found that this works, but I am curious if it is the best answer.
private void cATEGORYComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ComboBox cbx = (ComboBox)sender;
string s = ((DataRowView)cbx.Items.GetItemAt(cbx.SelectedIndex)).Row.ItemArray[0].ToString();
LoadDescriptionToCbo(s);
}

array list databind xaml windows 8 unsuccesss

Binding Data to Grid View finding it difficult
if (response.StatusCode == HttpStatusCode.OK)
{
List<dashboard1> variable1 = new List<dashboard1>();
var jsonString = await response.Content.ReadAsStringAsync();
dynamic arr = JsonParser.Parse(jsonString);
var items2 = arr[0].items;
foreach (var item3 in items2)
{
variable1.Add(item3.sectionName);
variable1.Add(item3.procedureName);
variable1.Add(item3.reportName);
variable1.Add(item3.templateName);
}
itemGridView.ItemsSource = variable1;
}
parsed json and stored it in list
now i don't know how to bind these values to User Interface please can u help me to continue and pass values to Grid view .
You have to bind properties of class dashboard1 with the UI controls. Suppose you are showing all the properties , in TextBlock then bind textbox's text property with property of class dashboard1.
So code will be like this.
<TextBlock Text={Binding sectionName} />
<GridView Grid.Row="2"
x:Name="itemGridView"
SelectionMode="Multiple"
SelectionChanged="itemGridView_SelectionChanged" >
<GridView.ItemTemplate >
<DataTemplate >
<Border BorderThickness="1" BorderBrush="#7b579b" Tapped="Border_Tapped_1" >
<Grid Name="tile" Background="{Binding SubjectTilebackGround}" Height="150" Width="150" Tapped="tile_Tapped_1" >
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock x:Name="hello2" Text="{Binding SubjectName}" Foreground="White" FontSize="15" Grid.Row="0" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="8" FontWeight="ExtraLight" Visibility="{Binding isTopSubjectTextVisible}"/>
<TextBlock Text="{Binding SubjectName}" Foreground="White" FontSize="15" Grid.Row="1" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="8" FontWeight="ExtraLight" Visibility="{Binding isBottomSubjectTextVisible}" />
</Grid>
</Border>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal" Margin="98,0,0,0"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate >
<DataTemplate >
<Grid Margin="0,0,0,6" >
<Button
AutomationProperties.Name="Group Title"
Style="{StaticResource TextPrimaryButtonStyle}">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding CategoryName}" Margin="2" FontSize="30" Foreground="White" FontWeight="Light" />
<TextBlock Text="( 17 Apps )" Margin="10,2,2,2" FontSize="25" Foreground="White" FontWeight="ExtraLight" VerticalAlignment="Bottom" />
</StackPanel>
</Button>
</Grid>
</DataTemplate>
</GroupStyle.HeaderTemplate>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid Orientation="Vertical" Margin="0,0,80,0" MaximumRowsOrColumns="3" />
</ItemsPanelTemplate>
</GroupStyle.Panel>
</GroupStyle>
</GridView.GroupStyle>
</GridView>
in this example i have added some more useful properties of gridview..and wherever i have used binding like this.
Background="{Binding SubjectTilebackGround}"
it means "SubjectTilebackGround" is a property present in the class of which objects you have made your list ..means in your case is is DASHBOARD1..so any properties available in your dashboard that you can bind them as i did. hope this will help.

Update source trigger when a button is clicked?

i've a contentcontrol in my Wpf-App (MVVM) which is bound to an object and displays the objects properties in textboxes, so the user can edit the values of the properties.
i have to buttons in my control "Ok" and "Cancel".. I would like to use UpdateSourceTrigger="Explicit" so that the ViewModel only gets updated when the user explicitly clicks 'Ok', rather than updating as textbox values are modified. How do i achive this.
this is how my viewmodel looks like..
class NeedViewModel : CarePlanEntityViewModelBase
{
public CPLNursingNeedVersion CurrentNeedVersion
{
get { return currentNeedVersion; }
set
{
currentNeedVersion = value;
this.OnPropertyChanged("CurrentNeedVersion");
}
}
}
this is how my view looks like
<DataTemplate x:Key="NeedDataEntryDataTemplate">
<Border Background="White"
BorderThickness="2"
BorderBrush="#4682B4"
local:PublishReadOnlyProperty.Observe="True"
local:PublishReadOnlyProperty.ActualWidth="{Binding Path=Width,Mode=OneWayToSource,UpdateSourceTrigger=PropertyChanged}"
MinWidth="410">
<Grid Name="mainGrid">
<Grid.BindingGroup>
<BindingGroup>
</BindingGroup>
</Grid.BindingGroup>
<Grid.RowDefinitions>
<RowDefinition Height="28" MinHeight="28"/>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="7" MaxWidth="7"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="68" MaxWidth="75"></ColumnDefinition>
<ColumnDefinition Width="10" MaxWidth="10"></ColumnDefinition>
<ColumnDefinition Width="68" MaxWidth="75"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Label Padding="0,3,0,3"
Name="label9"
Grid.Row="1" Grid.Column="1"
Margin="3"
FontSize="13"
HorizontalAlignment="Left" >Voimassaoloaika:</Label>
<hcw:HCWDateTimePicker Padding="0,3,0,3"
x:Name="startDateTimePicker"
Grid.Row="1" Grid.Column="2"
Margin="5,3,3,3"
FontSize="13"
HorizontalAlignment="Left"
MaxWidth="120"
DateControlMode="Mandatory"
SelectedDate="{Binding Path=CurrentNeedVersion.ValidFromDate,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
DisplayMode="DateOnly" />
<Label Padding="0,3,0,3"
Name="label8"
Grid.Row="1" Grid.Column="3"
Margin="3,3,3,3"
HorizontalAlignment="Center"
FontSize="13">-</Label>
<hcw:HCWDateTimePicker x:Name="endDateTimePicker"
Padding="0,3,0,3"
Grid.ColumnSpan="5" Grid.Row="1" Grid.Column="4"
Margin="3"
FontSize="13"
HorizontalAlignment="Left"
MaxWidth="120"
DisplayMode="DateOnly"
SelectedDate="{Binding Path=CurrentNeedVersion.ValidToDate,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<Label Name="label26"
Padding="0,3,0,3"
FontSize="13"
Grid.Row="2" Grid.Column="2"
Margin ="20,3,3,3"
HorizontalAlignment="Left"
Grid.ColumnSpan="6">Huomiomerkitty</Label>
<CheckBox Padding="0,3,0,10"
Grid.Row="2" Grid.Column="2"
IsChecked="{Binding Path=CurrentNeedVersion.IsNoteworthy,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
Name="note"
FontSize="13"
Margin="3,3,20,3"
VerticalAlignment="Center"
HorizontalAlignment="Left"
IsEnabled="True" />
<ContentControl Content="{Binding}"
Grid.Row="3" Grid.ColumnSpan="9"
ContentTemplate="{DynamicResource ClassificationSelectorDataTemplate}"/>
<Label Padding="0,3,0,3"
Grid.Row="4" Grid.Column="1"
Margin="3"
FontSize="13"
Name="needLabel"
HorizontalAlignment="Left" >Tarve:</Label>
<hcw:HCWTextBox Padding="3,3,0,3"
Grid.Row="4" Grid.Column="2" Grid.ColumnSpan="6"
FontSize="13"
Margin="3"
Name="needTextBox"
Text="{Binding Path=CurrentNeedVersion.NeedText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
TextWrapping="Wrap"
AcceptsReturn="True" />
<Label Padding="0,3,0,3"
Margin="3"
Name="goalLabel"
FontSize="13"
Grid.Row="8" Grid.Column="1" Grid.ColumnSpan="1">Tavoite:</Label>
<TextBox Padding="0,3,0,3"
Grid.Row="8" GridColumn="2" Grid.ColumnSpan="6"
FontSize="13"
Margin="3"
Text="{Binding Path=CurrentNeedVersion.GoalText, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
HorizontalAlignment="Stretch"
Name="goalTextBox"
TextWrapping="Wrap"
AcceptsReturn="True" />
<Label Name="temporaryLabel"
Padding="0,3,0,3"
FontSize="13"
Grid.Row="9" Grid.Column="2" Grid.ColumnSpan="6"
Margin="20,3,3,3"
HorizontalAlignment="Left">Keskeneräinen</Label>
<CheckBox Padding="0,3,0,10"
Grid.Row="9" Grid.Column="2"
Name="temporaryCheckBox"
FontSize="13"
Margin="3,3,20,3"
VerticalAlignment="Center"
HorizontalAlignment="Left"
IsEnabled="True" />
<Button Name="acceptButton"
Command="{Binding Path=AcceptNeedDEC}"
Margin="0,0,0,7"
Grid.Row="10" Grid.Column="5"
FontSize="13"
MinWidth="68"
Content="OK"
VerticalAlignment="Center"
Background="WhiteSmoke" />
<Button Command="{Binding Path=CloseDEC}"
Name="cancelButton"
Margin="0,0,0,7"
Grid.Row="10" Grid.Column="7"
HorizontalAlignment="Right"
FontSize="13"
MinWidth="68"
Content="Peruuta"
VerticalAlignment="Center"
Background="WhiteSmoke" />
</Grid>
</Border>
</DataTemplate>
You need to do it in code-behind:
var bindingExpression = BindingOperations.GetBindingExpression(startDateTimePicker, HCWDateTimePicker.SelectedDateProperty);
bindingExpression.UpdateSource();
You could take all of the properties the View is binding to and place them in a different class. Then have two instances of that class in the ViewModel, one public for data binding, and a private one. Once the button is clicked, copy the values from the public one to the private one, then run all of your logic against the private one.