Develop Reference

Calendar MouseLeftButtonDown is fired after clicking outside of the component

I want to raise event using MouseLeftButtonDown by clicking on a date in Calendar Control. But it is not raised until I click outside of this component.
Here is the xaml code:
<Controls:BasicCalendar Grid.Row="0"
x:Name="DemoCalendar"
DisplayDate="{Binding Path=DisplayDate, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
HighlightedDateText="{Binding HighlightedDateText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
Grid.Column="0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Margin="0,0,0,0"
DateHighlightBrush="Gold">
<i:Interaction.Triggers>
<i:EventTrigger EventName="MouseLeftButtonDown">
<cal:ActionMessage MethodName="CalendarSelectDateEvent">
<cal:Parameter Value="{Binding ElementName=DemoCalendar, Path=SelectedDate}" />
</cal:ActionMessage>
</i:EventTrigger>
</i:Interaction.Triggers>
</Controls:BasicCalendar>
Here is the event which I want to raise after clicking on some date in calendar:
public void CalendarSelectDateEvent(DateTime selectedDate)
{
this.ActualCalendarEvents = this.CalendarEvents.Where(x => x.Date >= selectedDate).ToList();
var a = this.ActualCalendarEvents;
this.ActualCalendarEvents = null;
NotifyOfPropertyChange(() => ActualCalendarEvents);
this.ActualCalendarEvents = a;
NotifyOfPropertyChange(() => ActualCalendarEvents);
}
When I tried to use Click event instead of MouseLeftButtonDown the Calendar Control was automatically handling it without firing CalendarSelectDateEvent. Is there a way to fire both events? (For Calendar Control selecting and highlighting the dat and for me CalendarSelectDateEvent)

I already figured it out. It was really easy in the end. The Calendar Control has property SelectedDate. I just binded SelectedDate to my property SelectedDateChanged in code behind and when the SelectedDate changed I raise the event CalendarSelectDateEvent.
<Controls:BasicCalendar Grid.Row="0"
x:Name="DemoCalendar"
DisplayDate="{Binding Path=DisplayDate, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
HighlightedDateText="{Binding HighlightedDateText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
Grid.Column="0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Margin="0,0,0,0"
SelectedDate="{Binding SelectedDateChanged}"
DateHighlightBrush="Gold">
</Controls:BasicCalendar>
Like this:
public DateTime SelectedDateChanged
{
get
{
return selectedDateChanged;
}
set
{
this.selectedDateChanged = value;
this.CalendarSelectDateEvent(this.selectedDateChanged);
}
}

Sending an object with a command parameter

I am using PRISM to develop my Windows Phone app using the MVVM design pattern. I need to pass my SelectedItem object from my LongListSelector through my delegate command into my method.
I can do that. The problem is, I'm passing in the wrong object. I don't know if it's a design problem or I am binding improperly.
I need the object to be an Album object. What I'm getting instead is either null or my ViewModel. (I've changed the code a few times and those are the only things I can get.)
XAML
<phone:LongListSelector x:Name="AlbumList" ItemsSource="{Binding Albums}"
Margin="10,0,0,0" LayoutMode="Grid" GridCellSize="200, 200"
ItemTemplate="{StaticResource AlbumTemplate}"
toolkit:TiltEffect.IsTiltEnabled="True"
>
<i:Interaction.Triggers>
<i:EventTrigger EventName="SelectionChanged">
<i:InvokeCommandAction Command="{Binding DataContext.SelectAlbumCommand, ElementName=ContentPanel}"
CommandParameter="{Binding}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</phone:LongListSelector>
ViewModel
private ObservableCollection<Album> _albums;
public ObservableCollection<Album> Albums
{
get { return _albums; }
set
{
if (value != null)
{
_albums = value;
NotifyPropertyChanged();
}
}
}
private Album _selectedAlbum;
public Album SelectedAlbum
{
get { return _selectedAlbum; }
// code removed as it is not needed; the object is null when trying to set.
}
public void AlbumSelected(object p)
{
App.Dispatcher.BeginInvoke(() =>
{
SelectedAlbum = (Album)p;
});
////Navigate("/Views/PhotosListPage.xaml");
}
//command that takes an object as parameter.
_selectAlbumCommand = new DelegateCommand<object>(this.AlbumSelected);

In case you merely want to set the SelectedAlbum by your SelectAlbumCommand, why don't you try binding the SelectedItem to SelectedAlbum instead?
<phone:LongListSelector x:Name="AlbumList" ItemsSource="{Binding Albums}"
SelectedItem="{Binding SelectedAlbum}" />
In case you actually want to pass the SelectedItem to the SelectedAlbumCommand (for some other reason), you should bind the CommandParameter to the SelectedItem of the LongListSelector
<i:InvokeCommandAction Command="{Binding DataContext.SelectAlbumCommand, ElementName=ContentPanel}" CommandParameter="{Binding ElementName=AlbumList, Path=SelectedItem}"/>

Apparently, you cannot use LongListSelector for this. I had to change this to a listbox and it worked fine.
Had I searched harder, I would have found this: How to select an item in LongListSelector using the MVVM-pattern?
and this: WP8 LongListSelector SelectedItem not bindable

detect selecteditem details in ListBox from MVVM app in windows phone

I have the following view.xaml and I bind a collection(SavedTracksCollection from viewmodel) to this list box and it displays the items in UI.
<phone:PanoramaItem Name="MusicTracks" Header="Saved Tracks" >
<Grid>
<ListBox x:Name="list" ItemsSource="{Binding SavedTracksCollection}" SelectedItem="{Binding SelectedItemTrack,Mode=TwoWay}">
<ListBox.ItemTemplate>
<DataTemplate>
<Button Background="Red" >
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding TrackTitle}"/>
<TextBlock Text="{Binding TrackUri}"/>
</StackPanel>
</Button>
<DataTemplate>
</ListBox.ItemTemplate>
</Grid>
</phone:PanoramaItem>
And the i have the following property defined in my viewmodel(this viewmodel is set as data context for my view) for the selecteditem binding "SelectedItemTrack".And i am binding SavedTracksCollection to the itemsource of the list.
private SavedTracksModel _SelectedItemTrack;
public SavedTracksModel SelectedItemTrack
{
get {
return _SelectedItemTrack;
}
set
{
if (value!=null)
_SelectedItemTrack = value;
//RaisePropertyChanged("SelectedItemTrack"); I dont think we need this.Let me know otherwise.
}
}
private List<SavedTracksModel> _SavedTracksCollection = new List<SavedTracksModel>();
public List<SavedTracksModel> SavedTracksCollection
{
get
{
return GetSavedTracks();
}
set
{
this._SavedTracksCollection = value;
RaisePropertyChanged("SavedTracksCollection");
}
}
But i am not able to determine how do i capture the SelectedITem event when user selectes an item from the Listbox .Currently it doesn't trigger the set method of the SelectedITemTrack .Once i capture the event with the details of selected item binding "TrackUri" i want to go to a new page where i can play the track.
any idea how to fix the issue ?

The first solution I can think of, why not just use the SelectionChanged event on ListBox?
<ListBox x:Name="list" ItemsSource="{Binding SavedTracksCollection}"
SelectedItem="{Binding SelectedItemTrack,Mode=TwoWay}"
SelectionChanged="List_OnSelectionChanged"/>
// in code behind
private void List_OnSelectionChanged(object sender, SelectionChangedEventArgs e)
{
// navigate here after validating the selected item
// or raise Command in your ViewModel programatically
}

Failing To Bind Multiple UI Components in WPF

Alright I tried my best but looks like I need help. I have a textbox, a listview and a button in my xaml file. Listview has two columns: Devicename and DeviceAddress. I have done a binding of both the listview and textbox in such a way, that whenever I select an item in listview(I2CDeviceList), the deviceaddress(2nd Column) gets displayed in my textbox.
XAML:
<TextBox PreviewTextInput="AddressBox_PreviewTextInput" Name="AddressI2C" Text="{Binding SelectedItem.I2CDeviceAddress, Path=AddressMessage, Mode=TwoWay, ElementName=I2cDeviceList}" />
<Button Content="I2C Read" Command="{Binding Path=I2CReadCommand}" Name="button9" />
<ListView Grid.Column="0" ItemsSource="{Binding I2CDeviceList}" SelectedItem="{Binding SelectedI2CDeviceList, Mode=TwoWay}" Height="100" HorizontalAlignment="Stretch" Name="I2cDeviceList" VerticalAlignment="Stretch" Width="Auto" >
<ListView.View>
<GridView>
<GridViewColumn Header="I2C Device" Width="Auto" DisplayMemberBinding="{Binding I2CDevName}" />
<GridViewColumn Header="I2C Device Address" Width="Auto" DisplayMemberBinding="{Binding I2CDeviceAddress}" />
</GridView>
</ListView.View>
</ListView>
Thus using SelectedItem.I2CDeviceAddress gives me the deviceaddress in my Textbox.
Now my view model has a property for the Button and the textbox and has the following method which gets invoked when button is clicked:
public void I2CReadCommandExecuted()
{
ReadMessage = string.Empty;
Byte[] buffer = new Byte[512];
int address;
string strValue = AddressMessage;
if (strValue.StartsWith("0x"))
{
strValue = strValue.Remove(0, 2);
address = Convert.ToInt32(strValue);
mComm.setAddress(address);
}
}
// This is for textBox
private string _AddressMessage = string.Empty;
public string AddressMessage
{
get
{
return _AddressMessage;
}
set
{
_AddressMessage = value;
NotifyPropertyChanged("AddressMessage");
}
}
// Property for ListView
public ObservableCollection<I2CModel> I2CDeviceList
{
get { return _I2CDeviceList; }
set
{
_I2CDeviceList = value;
NotifyPropertyChanged("I2CDeviceList");
}
}
// Property for Selected Item in ListView
private I2CModel _selectedI2CDeviceList;
public I2CModel SelectedI2CDeviceList
{
get { return _selectedI2CDeviceList; }
set
{
_selectedI2CDeviceList = value;
NotifyPropertyChanged("SelectedI2CDevSize");
}
}
Basically I have to remove the 0x from the value and store the hexadecimal value in my integer variable.
Here I am facing two issues:
When I put both Text="{Binding SelectedItem.I2CDeviceAddress, Path=AddressMessage, Mode=TwoWay, ElementName=I2cDeviceList}" the seelcted address from the listview doesnt appear in my textbox. The moment I remove Path=AddressMessage, Mode=TwoWay,, it works fine. How to make sure both of them work smoothly? Is their any other way I can get the selected item from the listview and display it in my textbox?
By using string strValue = AddressMessage; I am trying to save the content of AddressMessage in the string but when I debug my code, it always shows "null" even though I have "0x23"(hardcoded) in my textbox. Due to this I get the following error: Object reference not set to an instance of an object. at the beginning of if condition.
I tried my level best but it ain't happening. Am i missing something?

First of all there is no need to have seperate AddressMessage property. It can be done using SelectedI2CDeviceList. But still if you want to use it it can be achieved through below changes -
Set AddressMessage property when the selected item of listview changes
public I2CModel SelectedI2CDeviceList
{
get { return _selectedI2CDeviceList; }
set
{
_selectedI2CDeviceList = value;
AddressMessage = _selectedI2CDeviceList.I2CDeviceAddress;
NotifyPropertyChanged("SelectedI2CDevSize");
}
}
Also change the binding of textbox to below one:
<TextBox
Name="AddressI2C"
Text="{Binding Path=AddressMessage, Mode=TwoWay}" />
Hence whenever selected item of the listview changes it will set the content for textbox and when AddressMessage property is properly set you want get your second issue.
Hope this helps.

How to bind a datatable to a wpf editable combobox: selectedItem showing System.Data.DataRowView

I bound a datatable to a combobox and defined a dataTemplate in the itemTemplate.i can see desired values in the combobox dropdown list,what i see in the selectedItem is System.Data.DataRowView here are my codes:
<ComboBox Margin="128,139,123,0" Name="cmbEmail" Height="23" VerticalAlignment="Top" TabIndex="1" ToolTip="enter the email you signed up with here" IsEditable="True" IsSynchronizedWithCurrentItem="True" ItemsSource="{Binding}">
<ComboBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Path=username}"/>
</StackPanel>
</DataTemplate>
</ComboBox.ItemTemplate>
The code behind is so :
if (con != null)
{
con.Open();
//users table has columns id | username | pass
SQLiteCommand cmd = new SQLiteCommand("select * from users", con);
SQLiteDataAdapter da = new SQLiteDataAdapter(cmd);
userdt = new DataTable("users");
da.Fill(userdt);
cmbEmail.DataContext = userdt;
}
I've been looking for something like SelectedValueTemplate or SelectedItemTemplate to do the same kind of data templating but i found none.
I'll like to ask if i'm doing something wrong or it's a known issue for combobox binding?
if something is wrong in my code please point me to the right direction.
thanks for reading this

By default the combo box will call ToString() on the selected item to get a value to show - since you are binding to a DataRowView the result is the type (the default behaviour of ToString())
What you actually want to show it the username property of the selected item and to do this you can set the DisplayMemberPath of the combobox to "username"
(Also, if you do this, you'll probably find that you can get rid of the custom datatemplate too, since the username will also be used to populate each item.)
In response to your comment:
I don't want to be one of those programmers, but "it works on my machine".
My XMAL is:
<ComboBox Name="cmbEmail"
Height="23"
VerticalAlignment="Top"
TabIndex="1"
ToolTip="enter the email you signed up with here"
IsEditable="True"
IsSynchronizedWithCurrentItem="True"
ItemsSource="{Binding}"
DisplayMemberPath="username">
</ComboBox>
and my code behind is:
public partial class Window1 : Window
{
public Window1()
{
Users = new DataTable("users");
Users.Columns.Add("username");
Users.Rows.Add(CreateDataRow("Fred"));
Users.Rows.Add(CreateDataRow("Bob"));
Users.Rows.Add(CreateDataRow("Jim"));
InitializeComponent();
cmbEmail.DataContext = Users;
}
public DataTable Users { get; private set; }
private DataRow CreateDataRow(string userName)
{
DataRow dr = Users.NewRow();
dr["username"] = userName;
return dr;
}
}

i got an answer form msdn and it did it for me
<ComboBox IsEditable="True" ItemTemplate="{StaticResource comboTemplate}" ItemsSource="{Binding}" TextSearch.TextPath="username">
the reason was
Since the ComboBox is set to IsEditable="True", and the ComboBox contains a TextBox element to show the selected value. But the item in the ComboBox is RowView type; it shows the type information not the value in the TextBox.
notice the
TestSearch.TextPath="username"

I've found out why it wasn't working.Using DisplayMemberPath wasn't working but rather ItemTemplate.
Here is an example.
<Window.Resources>
<DataTemplate x:Key="comboTemplate">
<TextBlock Text="{Binding Path=username}" />
</DataTemplate>
</Window.Resources>
<ComboBox Margin="18,121,24,0" Name="cmbEmail" Tag="email" TabIndex="1" ToolTip="enter the email you signed up with here" IsEditable="True" IsSynchronizedWithCurrentItem="True" ItemTemplate="{StaticResource comboTemplate}" ItemsSource="{Binding}" Height="23" VerticalAlignment="Top" Style="{DynamicResource cmbBoxerrors}">
<ComboBox.Text>
<Binding Path="username"/>
</ComboBox.Text>
</ComboBox>
Notice the ItemTemplate
the xaml.cs code hasn't change. thanks for those who read and suggested solutions to me.