We Keep Coding

Changing title of panel in silverlight

I am trying to change the title of a panel in silverlight depending on what the user clicks. What I have for the panel controls is
<Silverlight_Controls:FloatingPanel
x:Name="pnlEntities"
Margin="0,0,0,20"
VerticalAlignment="Bottom"
HorizontalAlignment="left"
Width="auto"
Height="200"
Title=""
TitleColor="White"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
WindowBackgroundBorder="DarkGray"
WindowBackground="DodgerBlue"
ContentBackgroundBorder="Transparent"
ContentBackground="WhiteSmoke"
IsCloseButtonVisible="True"
IsDraggable="True"
IsHeightResizeable="True"
IsWidthResizeable="True"
IsHeaderVisible="True"
ScrollViewer.VerticalScrollBarVisibility="Auto"
ScrollViewer.HorizontalScrollBarVisibility="Auto">
<Data:DataGrid
</Data:DataGrid>
I have the button that I confirm does fire off but it doesn't change anything. I think I am not understanding if something needs to be reloaded or if updatelayout is the wrong thing to call.
private void buttInformation_ExecuteCompleted(object sender, IdentifyEventArgs e)
{
pnlEntities.Title = "AreaA";
pnlEntities.UpdateLayout();
}

Looks like you might be using a custom control. Find the control that is displaying the text in the title and change the text value of that control.

How To Bind to a Control Reference from a DataTemplate within DataGrid

I am not using MVVM or PRISM based models. I am trying to bind inside a DataGrid DataTemplate to a control that lives on the same level as my DataGrid. When I do this, I am returned null.
2 Questions:
What is LayoutRoot? When I refer to it, which in this case is a Grid, I am returned an object. If I change LayoutRoot to a canvas in my XAML, I am returned null.
How do I bind to a Canvas in my XAML inside the DataTemplate of a DataGrid Column?
I have the following XAML: (Trimmed because of Length)
<Grid x:Name="LayoutRoot" Background="#F7F7F7">
<Border>
<Canvas x:Name="LayoutCanvas">
<!-- A lot of Xaml -->
</Canvas>
</Border>
</Grid>
Within my Canvas, I have the following DataGrid:
<sdk:DataGrid x:Name="dgOrderContents" AutoGenerateColumns="False">
<sdk:DataGrid.Columns>
<sdk:DataGridTemplateColumn Header="Thumb">
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<ucp:PhotoComponentForDataGrid Source="{Binding PhotoUrl}" PopupTarget="{Binding ElementName='LayoutCanvas' }" Width="60" />
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn
</sdk:DataGrid.Columns>
</sdk:DataGrid>
My problem is when I try to bind using 'LayoutCanvas', the value is null which causes an error. If I bind to 'LayoutRoot', it works, except I need the Canvas because a a FloatableWindow control that lives inside my UserControl relies on a Canvas.
Thanks in advance for any help or suggestions.

It's possible that I was not able to get the binding to work because I am not using a MVVM or PRISM model. But I did get it to work by using my DataGrid's LoadingRow event.
private void dgOrderContents_LoadingRow(object sender, DataGridRowEventArgs e)
{
foreach (DataGridColumn col in dgOrderContents.Columns)
{
if (col.Header.ToString() == "Thumb")
{
PhotoComponentForDataGrid pcdControl = (PhotoComponentForDataGrid)col.GetCellContent(e.Row);
pcdControl.PopupTarget= this.LayoutCanvas;
}
}
}
This allowed me to reference the LayoutCanvas control from my custom user control.

Correct approach to make a ListBox Page Navigation using MVVM on Windows Phone

I am building an app for Windows Phone, and in this app I have a list of Movies with Title, Plot and Picture.
I have this list bound to a ListBox with a custom DataTemplate for the items showing the data. I also created a second page to show the details of each movie.
My problem now is the navigation between these pages. I'm using MVVM to build the applications and most of the approaches I've found searching on internet is to use the OnSelectionChanged event in the code-behind, but it goes agains what I want, that is to use MVVM.
Other approach I've seen, which is the one I'm trying, is to bind the SelectedItem to a property in the ViewModel, but I can't make it change the property, it seems that I cannot select an item in the listbox. Also, I don't have the visual feedback when I press one of the items in my listbox, like the feedback we have in the settings menu of the phone for example.
The code I'm using in the listbox is:
<ListBox Margin="0,0,-12,0" ItemsSource="{Binding Movies}" SelectedItem="{Binding SelectedMovieItem}" SelectionMode="Single" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="0,0,0,17">
<!--Replace rectangle with image-->
<Rectangle Height="50" Width="50" Fill="#FFE5001b" Margin="12,0,9,0"/>
<StackPanel Width="311">
<TextBlock Text="{Binding Name}" TextWrapping="NoWrap" Style="{StaticResource PhoneTextExtraLargeStyle}" Foreground="#000" />
<!--<TextBlock Text="{Binding LineTwo}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>-->
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Another approach I've seen is to use the INavigationService to achieve this, I found this article: http://windowsphonegeek.com/articles/MVVM-in-real-life-Windows-Phone-applications-Part1
I read the parts one and two, but I couldn't understand this one works.
So, what I want to know is whether the approach I'm using is the correct to make a page navigation, or if there is a better way using MVVM to do this with visual feedback on the listbox.

Why is handling Event in the code behind against MVVM? Handling events interaction is part of the UI. Of course you won't all you code logic there. But you are trying just to go to the next page. I do something like this :
private void MainListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
// If selected index is -1 (no selection) do nothing
if (MainListBox.SelectedIndex == -1)
return;
// Navigate to the new page
NavigationService.Navigate(new Uri("/Views/detailsPage.xaml?selectedItem=" + MainListBox.SelectedIndex, UriKind.Relative));
// Reset selected index to -1 (no selection)
MainListBox.SelectedIndex = -1;
}

Drag Event Won't Fire for ListBox in Silverlight

Hopefully this is an easy question. I'm using the ListBoxDragDropTarget from the Silverlight Toolkit to set up drag and drop from one ListBox to another. I can't seem to get the event to fire. Here's my XAML code:
<toolkit:ListBoxDragDropTarget HorizontalAlignment="Left"
HorizontalContentAlignment="Stretch"
VerticalAlignment="Top"
VerticalContentAlignment="Stretch"
Margin="39,117,0,0"
Grid.Row="1"
AllowDrop='True'>
<ListBox x:Name='columnHeadings'
MinHeight='100'
MinWidth='100'>
</ListBox>
</toolkit:ListBoxDragDropTarget>
<toolkit:ListBoxDragDropTarget AllowDrop='True'
Grid.Column='1'
Grid.Row='1'
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
VerticalAlignment="Center"
HorizontalAlignment="Left">
<ListBox x:Name='customerFields'
Grid.Column='1'
Grid.Row='1'
Visibility='Collapsed'
Drop='CustomerFieldsDrop'>
</ListBox>
</toolkit:ListBoxDragDropTarget>
And here's my event handler in the code behind page:
private void CustomerFieldsDrop(object sender, DragEventArgs e)
{
MessageBox.Show(string.Format("Something was dropped!"));
}
As you can see, I was aiming for something real simple. I tried assigning an event handler to the parent ListBoxDragDropTarget for the customerFields List Box; ironically, that worked.
My purpose here is to allow a user to import a text file and get a listing of the file's column headers in one List Box and then "connect" them to data fields listed in the second List Box. So no list reordering or moving items from one list to another.
The columnHeadings.ItemsSource property is a string[] object. The customerFields.ItemsSource property is an IEnumerable<string> object.
Any insight would be appreciated.

I think the AllowDrop="True" and Drop="EventName" properties need to be within the same element to work. You probably have to set the AllowDrop property to "True" in the ListBox itself:
<ListBox x:Name="customerFields"
Grid.Column="1"
Grid.Row="1"
Visibility="Collapsed"
Drop="CustomerFieldsDrop"
AllowDrop="True"
</ListBox>
Or add the Drop="CustomerFieldsDrop" property to the ListBoxDragDropTarget tag:
<toolkit:ListBoxDragDropTarget AllowDrop='True'
Grid.Column='1'
Grid.Row='1'
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
VerticalAlignment="Center"
HorizontalAlignment="Left"
Drop="CustomerFieldsDrop">
Either one should work...

Programmatically access data from datacontext in custom user control

I have defined a custom user control which I use in a MVVM Prism Silverlight (c#) application.
I use my control in a view like this:
<my2:DetailsTable Name="detailTable"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
DataContext="{Binding MyDataObject}" />
Then I would like to use this bound MyDataObject in code behind inside my custom control DetailTable. I want to first bind the object to datacontext as shown and then in code behind display this objects properties to labels, textboxes, etc. in this custom user control.
How can achieve this?

In your code behind, after you have set the data context in the xaml, you can retrieve the bound object using:
MyDataObjectType dataObject = (MyDataObjectType)detailsTable.DataContext;
Then you can use dataObject.Property1 as needed.

If the textbox/textblock in the same view then you can do this by binding Text property of the text box / text block with MyDataObject.Property1 etc.
Sample code.
<my2:DetailsTable Name="detailTable"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
DataContext="{Binding MyDataObject}" />
<TextBox Text={Binding MyDataObject.Property1}/>
<TextBlock Text={Binding MyDataObject.Property2}/>