Caliburn Micro Binding on Dependency Property - data-binding

I have an custom control with following DP:
public FrameworkElement NoResultContent
{
get { return (FrameworkElement)GetValue(NoResultContentProperty); }
set { SetValue(NoResultContentProperty, value); }
}
public static readonly DependencyProperty NoResultContentProperty =
DependencyProperty.Register("NoResultContent", typeof(FrameworkElement), typeof(AdvancedAutoCompleteBox), new PropertyMetadata(null));
The ControlTemplate of my custom control shows this DP in a ContentControl:
<ContentControl Content="{TemplateBinding NoResultContent}" />
It's used in a view to provide arbitrary functions:
<Controls:AdvancedAutoCompleteBox
x:Name="Box"
ItemsSource="{Binding Persons}"
SelectedItem="{Binding SelectedPerson}"
Watermark="Search here">
<Controls:AdvancedAutoCompleteBox.NoResultContent>
<StackPanel>
<Button
Content="Add by ICommand"
Command="{Binding AddPerson}" />
<Button
x:Name="AddPerson"
Content="Add by Caliburn" />
</StackPanel>
</Controls:AdvancedAutoCompleteBox.NoResultContent>
</Controls:AdvancedAutoCompleteBox>
The Command-Binding to a ICommand works just fine. Buy why does it not work with Caliburn.Micro?
I also tried to attach the context to the second Button manually by cal:Bind.Model

Related

how to change custom render label textcolor inside list view in xamarin forms

We are developing a small application, we have created dashboard using custom render but I can’t change label text color. it is default showing like lable text color white, list view background color It will come via api so that if it is coming white background then label text color is not able to see. Here I have attached the code below. Give me suggestions to resolve this issue
Menucontrol custom render
public static readonly BindableProperty ItemsSourceProperty =
BindableProperty.Create<MenuControl, IEnumerable>(
view => view.ItemsSource,
null,
BindingMode.TwoWay,
null,
propertyChanged: (bindableObject, oldValue, newValue) =>
{
((MenuControl)bindableObject).ItemsSourceChanged(bindableObject, oldValue, newValue);
}
);
public IEnumerable ItemsSource
{
get
{
return (IEnumerable)GetValue(ItemsSourceProperty);
}
set
{
SetValue(ItemsSourceProperty, value);
}
}
Add a Data Trigger
<ListView>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout BackgroundColor={Binding BGColor}>
<Label TextColor="White">
<Label.Triggers>
<!--(or Value ="White" depends on binding value Xamarin.Color or string) -->
<DataTrigger TargetType="Label" Binding={Binding BGColor} Value="#FFFFFF">
<Setter Property="TextColor" Value="Red"/>
<!--(or your color) -->
</DataTrigger>
</Label.Triggers>
</Label>
</StackLayout>
<ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
So when your BGColor(or any property you bind to color) property is something you think that can clash(for e.g. white) with your text color(e.g. also white) use data triggers. You can create multiple but if there are more than 3 or 4 I would advise you to use converters in that case.

UWP Cannot bind ICommand to User control

I am currently working on a UWP project and I am trying to bind some command from the current page to an usercontrol.
While every other properties seems to be correctly bound, the command is not and thus is not working.
Do you have any idea from where it might come ?
Here is my code (main page):
<Grid Visibility="{Binding LoginStep, Converter={StaticResource LogConverter}, ConverterParameter='InputPin'}"
Height="450px" Width="280px">
<PIN:PinInput Pin="{Binding CurrentUser.Pin, Mode=TwoWay}" x:Uid="btnPin" SubmitCommand="{Binding AddPinCommand, Mode=TwoWay}"></PIN:PinInput>
</Grid>
View model:
private ICommand _addPinCommand;
public ICommand AddPinCommand
{
get
{
return _addPinCommand ?? (_addPinCommand = new CommandBase((o) =>
{
this.LoginStep = LoginStep.ChoseCompany;
}));
}
}
User control:
DataContext="{Binding RelativeSource={RelativeSource Self}}"
<Grid Grid.Row="3">
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Style="{StaticResource btnStyle}" Command="{Binding SubmitCommand, Mode=TwoWay}">
<StackPanel>
<Border Style="{StaticResource btnInnerStyle}" Width="100px" CornerRadius="10">
<TextBlock Text="{Binding SubmitButtonText}" Style="{StaticResource btnText}"></TextBlock>
</Border>
</StackPanel>
</Button>
</Grid>
public static readonly DependencyProperty submitCommandProperty = DependencyProperty.Register("SubmitCommand", typeof(ICommand), typeof(PinInput), null);
public ICommand SubmitCommand
{
get
{
return (ICommand)GetValue(submitCommandProperty);
}
set
{
SetValue(submitCommandProperty, value);
}
}
Note:
in the error log I have:
Error: BindingExpression path error: 'AddPinCommand' property not found on 'PAT.Mobile.UTrakk.UWP.Views.Components.PinInput'. BindingExpression: Path='AddPinCommand' DataItem='PAT.Mobile.UTrakk.UWP.Views.Components.PinInput'; target element is 'PAT.Mobile.UTrakk.UWP.Views.Components.PinInput' (Name='null'); target property is 'SubmitCommand' (type 'ICommand')
Thanks in advance,
Thomas K. T.
Ok this one was weird but here is what seems to do the trick:
<PIN:PinInput SubmitCommand="{Binding DataContext.AddPinCommand, ElementName=curPage}" Pin="{Binding CurrentUser.Pin, Mode=TwoWay}" x:Uid="btnPin" ></PIN:PinInput>
With "curPage" = name of the current page.
I do not fully understand why I have to do this, since CurrentUser.Pin is working perfectly fine without this work around.
Can someone explain ?

ObservableCollection<Double[]> and XAML

I have a class that inherits ObservableCollection< Double[] > (let's call it "TestClass"). I.e. collection of double arrays. Can I use this kind of collection in XAML. I'm trying to add items but it looks like I cannot add double arrays as items. Is this even possible?
Something like this:
<TestClass>
<x:Array Type="sys:Double">
<!-- What comes here...? -->
</x:Array>
</TestClass>
Actually, I would rather like to use ObservableCollection< Double[,] > but I think it's impossible - two-dimensional array I mean.
Help me out here... :)
First, you need a ViewModel. The ViewModel will be your container class where we insert custom double-arrays or fetch them from the database. If it's not just a lookup, you will need to implement INotifyPropertyChanged (but that's a different topic):
namespace MyCompany.Common.ViewModels
{
using System.ComponentModel;
using System.Runtime.CompilerServices;
public class PointsArrayVM
{
private double[] _points;
public double[] Points
{
get
{
return _points;
}
set
{
_points = value;
}
}
}
}
In this example, I'll add two custom records of double[] (firstArray & secondArray). I then assign the collection to a CollectionViewSource, and (just to illustrate) I assign more records from the database to a second CollectionViewSource with the exposed MainViewModel property, List<PointsArrayVM> DatabasePoints. If it's not just a lookup, you will need an ObservableCollection instead of a List. In your XAML, under Window.Resources, add the following:
<x:Array x:Key="firstArray" Type="sys:Double"
xmlns:sys="clr-namespace:System;assembly=mscorlib">
<sys:Double>1.1</sys:Double>
<sys:Double>1.2</sys:Double>
<sys:Double>1.3</sys:Double>
</x:Array>
<x:Array x:Key="secondArray" Type="sys:Double"
xmlns:sys="clr-namespace:System;assembly=mscorlib">
<sys:Double>2.1</sys:Double>
<sys:Double>2.2</sys:Double>
<sys:Double>2.3</sys:Double>
</x:Array>
<x:Array x:Key="pointsArray" Type="{x:Type viewmodels:PointsArrayVM}"
xmlns:viewmodels="clr-namespace:MyCompany.Common.ViewModels;assembly=Common">
<viewmodels:PointsArrayVM Points="{StaticResource firstArray}"/>
<viewmodels:PointsArrayVM Points="{StaticResource secondArray}"/>
</x:Array>
<CollectionViewSource x:Key="customPointsCollectionViewSource" Source="{StaticResource pointsArray}"/>
<CollectionViewSource x:Key="databasePointsCollectionViewSource" Source="{Binding DatabasePoints}"/>
Now that we have our CollectionViewSources, we can add them to a CompositeCollection with CollectionContainers. In this example I'm using Points[0] as the display text, and Points1 as the selected value:
<ComboBox Text="{Binding PointsFilter}" VerticalAlignment="Top"
SelectedValuePath="Points[0]" DisplayMemberPath="Points[1]">
<ComboBox.ItemsSource>
<CompositeCollection>
<CollectionContainer Collection="{Binding Source={StaticResource customPointsCollectionViewSource}}"/>
<CollectionContainer Collection="{Binding Source={StaticResource databasePointsCollectionViewSource}}"/>
</CompositeCollection>
</ComboBox.ItemsSource>
</ComboBox>
I hope this helps! For some very informative XAML tips, have a look at this site.
Regarding your second question
Yes, WPF seems to have a problem with assigning a control path to a specific point in a multi-dim array. You can however work around this by also having a Points2DArray ViewModel that contains an array of PointsArrayVM objects:
namespace MyCompany.Common.ViewModels
{
using System.ComponentModel;
using System.Runtime.CompilerServices;
public class Points2DArrayVM
{
private PointsArrayVM[] _pointsArrays;
public PointsArrayVM[] PointsArrays
{
get
{
return _pointsArrays;
}
set
{
_pointsArrays = value;
}
}
}
}
So in your XAML, you can now put the collections of one ViewModel into the other container ViewModel:
<x:Array x:Key="pointsArray1" Type="{x:Type viewmodels:PointsArrayVM}"
xmlns:viewmodels="clr-namespace:MyCompany.Common.ViewModels;assembly=Common">
<viewmodels:PointsArrayVM Points="{StaticResource firstArray}"/>
<viewmodels:PointsArrayVM Points="{StaticResource secondArray}"/>
</x:Array>
<x:Array x:Key="pointsArray2" Type="{x:Type viewmodels:PointsArrayVM}"
xmlns:viewmodels="clr-namespace:MyCompany.Common.ViewModels;assembly=Common">
<viewmodels:PointsArrayVM Points="{StaticResource firstArray}"/>
<viewmodels:PointsArrayVM Points="{StaticResource secondArray}"/>
</x:Array>
<x:Array x:Key="points2DArray" Type="{x:Type viewmodels:Points2DArrayVM}"
xmlns:viewmodels="clr-namespace:MyCompany.Common.ViewModels;assembly=Common">
<viewmodels:Points2DArrayVM PointsArrays="{StaticResource pointsArray1}"/>
<viewmodels:Points2DArrayVM PointsArrays="{StaticResource pointsArray2}"/>
</x:Array>
<CollectionViewSource x:Key="customPointsCollectionViewSource" Source="{StaticResource points2DArray}"/>
Then in your ComboBox, it would be something like:
<ComboBox Text="{Binding PointsFilter}" VerticalAlignment="Top"
SelectedValuePath="PointsArrays[0].Points[0]" DisplayMemberPath="PointsArrays[0].Points[1]">
<ComboBox.ItemsSource>
<CompositeCollection>
<CollectionContainer Collection="{Binding Source={StaticResource customPointsCollectionViewSource}}"/>
</CompositeCollection>
</ComboBox.ItemsSource>
</ComboBox>

Binding to selection of ViewModel

I'm trying to bind my ListBox to a selection of my ViewModel, because I have multiple ListBoxes in a Pivot and I don't want to type out the entire Page for each property. To illustrate my issue, here's a small sample:
XAML:
<DataTemplate x:Key="PropertyTemplate">
<StackPanel>
<TextBlock Text="{Binding Label}" />
<TextBlock Text="{Binding Value}" />
</StackPanel>
</DataTemplate>
<controls:Pivot>
<controls:PivotItem>
<ListBox ItemsSource="{Binding PropertySelectionOne}" ItemTemplate="{StaticResource PropertyTemplate}" />
</controls:PivotItem>
<controls:PivotItem>
<ListBox ItemsSource="{Binding PropertySelectionTwo}" ItemTemplate="{StaticResource PropertyTemplate}" />
</controls:PivotItem>
</controls:Pivot>
ViewModel:
public class SomeViewModel
{
private Property _propOne;
public Property PropOne
{
get { return _propOne; }
set { _propOne = value; NotifyPropertyChanged("PropOne"); }
}
private Property _propTwo;
public Property PropTwo
{
get { return _propTwo; }
set { _propTwo = value; NotifyPropertyChanged("PropTwo"); }
}
private Property _propThree;
public Property PropThree
{
get { return _propThree; }
set { _propThree = value; NotifyPropertyChanged("PropThree"); }
}
}
So basically I want to bind my ListBoxes to PropertySelectionOne and PropertySelectionTwo, which would contain references to a selection of the properties in my ViewModel. For instance, PropertySelectionOne could include PropOne and PropTwo and PropertySelectionTwo could include PropTwo and PropThree.
Is there a simple way to "group" these properties to a new property to bind against without changing the architecture of my application?
Thanks
If you've got different properties to be displayed from the same date type in different list boxes, then arguably you need to split your view model, but you say you don't want to change the architecture of your application, which is your choice.
So, what you need to do is to provide a different ItemTemplate for each ListBox that defines which properties and how you want to display in each ListBox. Then you can bind the ItemsSource for all of the list boxes to the same data source but they will present different properties according to the ItemTemplate.
Not sure how familiar you are with these concepts, but you know that ItemsSource needs to be a collection of your data instances (SomeViewModel?), right?

Rendering a Heterogeneous Collection of View Models in Silverlight 2

I have a hierarchy of view models representing formatted content:
public abstract class ContentPartViewModel : ViewModel
{
}
public class TextContentPartViewModel : ContentPartViewModel
{
public string Text { ... }
}
public class TitleContentPartViewModel : TextContentPartViewModel
{
}
public class HyperlinkContentPartViewModel : TextContentPartViewModel
{
public string Uri { ... }
}
I have an encompassing view model that contains a collection of ContentPartViewModels to be rendered:
public class ContentViewModel
{
public ICollection<ContentPartViewModel> ContentParts { ... }
}
I then have a ContentView that renders all parts of the content:
<UserControl ...>
<ItemsControl ItemsSource="{Binding ContentParts}"/>
</UserControl>
In an ideal world, I would just define a DataTemplate for each of the content part types and they would be rendered accordingly. However, Silverlight does not support the DataType property on the DataTemplate class, so that is not an option.
Another option would be to provide a DataTemplateSelector and do the mapping from view model type to DataTemplate myself. Alas, ItemsControl in SL2 does not have an ItemTemplateSelector property - only an ItemTemplate property.
That left me with no option but to provide an ItemTemplate that then uses a converter to turn off all the UI apart from the piece relevant to that content part:
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding Text}" FontWeight="Bold" Visibility="{Binding Converter={StaticResource TitleContentPartConverter}}"/>
<TextBlock Text="{Binding Text}" Visibility="{Binding Converter={StaticResource TextContentPartConverter}}"/>
<HyperlinkButton Content="{Binding Text}" NavigateUri="{Binding Uri}" Visibility="{Binding Converter={StaticResource HyperlinkContentPartConverter}}"/>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
This is obviously rather awful, both for performance and for readability/correctness of code. It also makes it much harder for me to format the output correctly. So, questions:
Can anyone recommend a better way to do this in SL2?
Can anyone confirm whether the situation has improved in SL3?
Thanks,
Kent
Yes. DataType in DataTemplate is not supported in Silverlight 2 or Silverlight 3.
You can work around ItemTemplateSelector in Silverlight. Please take a look at this sample.
http://silverlight.net/forums/t/12598.aspx
protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
{
base.PrepareContainerForItemOverride(element, item);
DataTemplateSelector selector = this.ItemTemplateSelector;
if (null != selector)
{
((ContentPresenter)element).ContentTemplate = selector.SelectTemplate(item, element);
}
}

Resources