WPF Move grid Error - c#

I'm trying something new. I've got a few grids, and when I try to grab a grid i want to move its parent around my top grid. At the moment I get a System.NullReferenceException on m_startOffset = new Vector(translate.X, translate.Y); in the Grid_MouseDown method. Does someone know how i should tackle this problem?
UI:
<Grid x:Name="GridHost">
<Grid x:Name="GRLogin" Margin="1401,292,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Width="501" d:IsHidden="True" Focusable="True">
<Grid Height="30" VerticalAlignment="Top" Background="#FF1585B5" Margin="0" MouseLeftButtonUp="Grid_MouseUp" MouseLeftButtonDown="Grid_MouseDown" MouseMove="Grid_MouseMove" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Button x:Name="GRLoginClose" Content="X" Background="{x:Null}" Foreground="White" FontWeight="Bold" OpacityMask="Black" Margin="470,0,0,0" Width="30" Height="30" Click="Close"/>
<Button Content="-" Background="{x:Null}" Foreground="White" FontWeight="Bold" OpacityMask="Black" Margin="0,0,30,0" Width="30" Height="30" HorizontalAlignment="Right"/>
<Label Content="Login" HorizontalAlignment="Center" Margin="0" FontWeight="Bold"/>
</Grid>
<Grid HorizontalAlignment="Left" Height="250" Margin="0,30,0,0" VerticalAlignment="Top" Width="500" Background="#FF262626">
<PasswordBox HorizontalAlignment="Center" Margin="206,130,120,94" VerticalAlignment="Center" Width="174"/>
<Label Content="Password" HorizontalAlignment="Center" Margin="122,130,308,94" VerticalAlignment="Center" RenderTransformOrigin="-1.737,0.462" Width="70"/>
<Label Content="Username" HorizontalAlignment="Center" Margin="122,99,308,125" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5" Width="70"/>
<TextBox HorizontalAlignment="Center" Height="23" Margin="206,99,120,125" TextWrapping="Wrap" VerticalAlignment="Center" Width="174" RenderTransformOrigin="0.467,-0.346"/>
<Button Content="Login" HorizontalAlignment="Left" VerticalAlignment="Top" Width="258" Margin="122,180,0,0" Height="40" Background="#FF1585B5" Foreground="White" FontWeight="Bold"/>
</Grid>
</Grid>
Movement code:
private void Grid_MouseDown(object sender, MouseButtonEventArgs e)
{
FrameworkElement element = ((Grid)sender).Parent as Grid;
TranslateTransform translate = element.RenderTransform as TranslateTransform;
m_start = e.GetPosition(GridHost);
m_startOffset = new Vector(translate.X, translate.Y);
element.CaptureMouse();
}
private void Grid_MouseMove(object sender, MouseEventArgs e)
{
FrameworkElement element = ((Grid)sender).Parent as Grid;
TranslateTransform translate = element.RenderTransform as TranslateTransform;
if (element.IsMouseCaptured)
{
Vector offset = Point.Subtract(e.GetPosition(GridHost), m_start);
translate.X = m_startOffset.X + offset.X;
translate.Y = m_startOffset.Y + offset.Y;
}
}
private void Grid_MouseUp(object sender, MouseButtonEventArgs e)
{
FrameworkElement element = ((Grid)sender).Parent as Grid;
element.ReleaseMouseCapture();
}

Declare the parent Grid's RenderTransform in the XAML:
<Grid x:Name="GRLogin" Margin="1401,292,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Width="501" d:IsHidden="True" Focusable="True">
<Grid.RenderTransform>
<TranslateTransform/>
</Grid.RenderTransform>
...
</Grid>
You could also check the RenderTransform for null, in which case you set it: element.RenderTransform = new TranslateTransform();

Related

could not detect right click mouse down and up events

I have written a WPF software VS 2019 in Windows 7.
I want to achieve this function: when I right click a mouse down and draw a line in the canvas, a line will be drawn, starting at the point when I right click down a mouse and ending when I release the right click.
I have tried many method, but seems that the program could not detect the right click events.
<UserControl x:Class="STIGenericReport.UserControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Height="407" Width="633" Background="White" BorderBrush="White" Focusable="False">
<Grid Name="maingrid" Background="White" Height="405" Width="616" MinWidth="500">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="619*" />
<ColumnDefinition Width="10*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height ="574*" />
<RowDefinition Height="26" MinHeight="16" />
</Grid.RowDefinitions>
<Viewport3D Name="mainViewport" ClipToBounds = "False"
IsHitTestVisible="false"
RenderOptions.EdgeMode="Aliased" Margin="12,52,144,47">
<Viewport3D.Camera>
<OrthographicCamera x:Name="camera" Width="2"
FarPlaneDistance="10"
NearPlaneDistance="1"
LookDirection="0,0,-1"
UpDirection="0,1,0"
Position="0,0,2" />
</Viewport3D.Camera>
<Viewport3D.Children>
<ModelVisual3D x:Name="Light1">
<ModelVisual3D.Content>
<DirectionalLight Color="White" Direction="1, 1, -1" />
</ModelVisual3D.Content>
</ModelVisual3D>
<ModelVisual3D x:Name="Light2">
<ModelVisual3D.Content>
<DirectionalLight Color="White" Direction="-1, 1, -1" />
</ModelVisual3D.Content>
</ModelVisual3D>
<ModelVisual3D x:Name="Light3">
<ModelVisual3D.Content>
<DirectionalLight Color="White" Direction="0,-1,-0.5" />
</ModelVisual3D.Content>
</ModelVisual3D>
</Viewport3D.Children>
</Viewport3D>
<Canvas x:Name="canvasOn3D" Background="#00E6FFFF"
Margin="20,52,102,18"></Canvas>
<Label Content="Trayinfo &" FontSize="16" FontWeight="Bold" Height="34" HorizontalAlignment="Left" Margin="192,0,0,0" Name="lblTrayinfo" VerticalAlignment="Top" Width="194" />
<Button Height="25" HorizontalAlignment="Left" Margin="499,0,0,257" Name="btn9" VerticalAlignment="Bottom" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Button Height="25" HorizontalAlignment="Left" Margin="499,0,0,232" Name="btn8" VerticalAlignment="Bottom" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Button HorizontalAlignment="Left" Margin="499,149,0,207" Name="btn7" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Button Height="25" HorizontalAlignment="Left" Margin="499,0,0,182" Name="btn6" VerticalAlignment="Bottom" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Button Height="25" HorizontalAlignment="Left" Margin="499,0,0,157" Name="btn5" VerticalAlignment="Bottom" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Button Height="25" HorizontalAlignment="Left" Margin="499,0,0,132" Name="btn4" VerticalAlignment="Bottom" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Button Height="25" HorizontalAlignment="Left" Margin="499,0,0,107" Name="btn3" VerticalAlignment="Bottom" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Button Height="25" HorizontalAlignment="Left" Margin="499,0,0,82" Name="btn2" VerticalAlignment="Bottom" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Button Height="25" HorizontalAlignment="Left" Margin="499,0,0,57" Name="btn1" VerticalAlignment="Bottom" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Button Height="25" HorizontalAlignment="Left" Margin="499,0,0,282" Name="btn10" VerticalAlignment="Bottom" Width="50" Background="White" BorderThickness="0" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,57" Name="lbl1" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,82" Name="lbl2" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,107" Name="lbl3" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,132" Name="lbl4" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,157" Name="lbl5" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,182" Name="lbl6" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,207" Name="lbl7" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,232" Name="lbl8" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,257" Name="lbl9" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Height="25" HorizontalAlignment="Right" Margin="0,0,12,282" Name="lbl10" VerticalAlignment="Bottom" Width="45" Background="White" BorderBrush="White" />
<Label Content="Pacakage info" HorizontalAlignment="Center" Width="Auto" Height="32" Name="lblPkgname" FontSize="16" FontWeight="Bold" Margin="300,0,191,347" />
</Grid>
private void OnPreviewMouseRightButtonDown(object sender, MouseButtonEventArgs args)
{
if (args.RightButton == MouseButtonState.Pressed)
{
currentPoint = args.GetPosition(this);
}
}
private void OnPreviewMouseRightButtonUp(object sender, MouseButtonEventArgs args)
{
if (args.RightButton == MouseButtonState.Released)
{
Line line = new Line();
line.Stroke = SystemColors.WindowFrameBrush;
line.X1 = currentPoint.X;
line.Y1 = currentPoint.Y;
line.X2 = currentPoint_2.X;
line.Y2 = currentPoint_2.Y;
line.StrokeThickness = 2;
canvasOn3D.Children.Add(line);
}
}
When I debug this program, it does not enter into this function when I right click the mouse.
Previewmouserightbuttondown doesn't seem to work even in a simple experiment.
You also have some oddities in your code there.
The co-ordinates of your mouse should be based on the canvas ( presumably ).
Here's some simpler working markup and code.
In Mainwindow I just added a canvas inside the default Grid:
<Grid>
<Canvas
Name="lineCanvas"
Background="Transparent"
PreviewMouseDown="lineCanvas_PreviewMouseDown"
PreviewMouseUp="lineCanvas_PreviewMouseUp"
>
</Canvas>
</Grid>
Notice I handle previewmousedown and up. The background of the canvas is set to transparent so it will be hit-testable.
My code ( which is working ):
public MainWindow()
{
InitializeComponent();
}
Point startPoint = new Point();
private void lineCanvas_PreviewMouseDown(object sender, MouseButtonEventArgs e)
{
if (e.ChangedButton == MouseButton.Right)
{
startPoint = Mouse.GetPosition(lineCanvas);
}
}
private void lineCanvas_PreviewMouseUp(object sender, MouseButtonEventArgs e)
{
if (startPoint.X == 0 && startPoint.Y == 0)
{
return;
}
var currentPoint = Mouse.GetPosition(lineCanvas);
Line line = new Line();
line.Stroke = SystemColors.WindowFrameBrush;
line.X1 = startPoint.X;
line.Y1 = startPoint.Y;
line.X2 = currentPoint.X;
line.Y2 = currentPoint.Y;
line.StrokeThickness = 2;
lineCanvas.Children.Add(line);
startPoint = new Point();
}
Note that in our map editor where I do a similar process for drawing straight lines I add a "rubber band" temporary line which follows the mouse round showing where the line will end up. This re-assures the user that something is happening. You might want to consider that approach.

How to access a specific item in itemscontrol and retrieve some data in UWP

I have an ItemsControl with DataTemplate in my Page.Xaml and the code is like below:
<ItemsControl x:Name="chatUI" VerticalAlignment="Bottom">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid x:Name="myGrid" Width="340" Background="{Binding Background}" HorizontalAlignment="{Binding GridHorizontalAlign}" Margin="10,0,10,10" MinHeight="45" BorderBrush="#FF003A4F" BorderThickness="0,0,0,2">
<Polygon Visibility="{Binding RightVisibility}" Fill="{Binding Background}" Points="0,0 5,6, 0,12" VerticalAlignment="Top" HorizontalAlignment="Right" Margin="0,0,-5,0" />
<Polygon Visibility="{Binding LeftVisibility}" Fill="{Binding Background}" Points="5,0 0,6, 5,12" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="-5,0,0,0" />
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" FontSize="15" FontFamily="Segoe UI" Foreground="White" Margin="10,10,10,0"/>
<TextBlock Grid.Row="1" Text="{Binding Time}" TextWrapping="Wrap" FontSize="11" FontFamily="Segoe UI" Foreground="LightGray" Margin="10,0,10,5" VerticalAlignment="Bottom" TextAlignment="Right"/>
</Grid>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
What I need right now is getting Text which is bound to the TextBlock when I right click on the grid named myGrid. How is that possible in C#?
We can add the RightTapped event of the Grid, it will be fired when you right click the Grid.
In the RightTapped event we can use Grid.Children to get the collection of child elements of the Grid. That we can get the Grid in the root Grid that named myGrid. That we can use the Grid.Children to get the TextBlock in the Grid.
For example:
private async void myGrid_RightTapped(object sender, RightTappedRoutedEventArgs e)
{
var RightTapGrid = sender as Grid;
var childernElements = RightTapGrid.Children;
foreach (var item in childernElements)
{
var grid = item as Grid;
if (grid != null)
{
var itemchildernElements = grid.Children;
foreach (var text in itemchildernElements)
{
var textBlock = text as TextBlock;
var dialog = new ContentDialog()
{
Title = textBlock.Text,
MaxWidth = this.ActualWidth
};
dialog.PrimaryButtonText = "OK";
dialog.SecondaryButtonText = "Cancel";
await dialog.ShowAsync();
break;
}
}
}
}
If you get your Binding Data from Class called ClassName
You can try this code
XAML:
<ListView x:Name="chatUI" VerticalAlignment="Bottom" SelectionChanged="chatUI_SelectionChanged">
<ListView.ItemTemplate>
<DataTemplate>
<Grid x:Name="myGrid" Width="340" Background="{Binding Background}" HorizontalAlignment="{Binding GridHorizontalAlign}" Margin="10,0,10,10" MinHeight="45" BorderBrush="#FF003A4F" BorderThickness="0,0,0,2">
<Polygon Visibility="{Binding RightVisibility}" Fill="{Binding Background}" Points="0,0 5,6, 0,12" VerticalAlignment="Top" HorizontalAlignment="Right" Margin="0,0,-5,0" />
<Polygon Visibility="{Binding LeftVisibility}" Fill="{Binding Background}" Points="5,0 0,6, 5,12" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="-5,0,0,0" />
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" FontSize="15" FontFamily="Segoe UI" Foreground="White" Margin="10,10,10,0"/>
<TextBlock Grid.Row="1" Text="{Binding Time}" TextWrapping="Wrap" FontSize="11" FontFamily="Segoe UI" Foreground="LightGray" Margin="10,0,10,5" VerticalAlignment="Bottom" TextAlignment="Right"/>
</Grid>
</Grid>
</DataTemplate>
</Listview.ItemTemplate>
And add SelectionChanged Event :
private void chatUI_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ListView view = (ListView)sender;
//Get Selected Item
ClassName class = view.SelectedItem as ClassName;
string path = class.Text;
// Now we have Text of selected item in Listview
}

ListBox SelectionChanged only once?

I have a ListBox which I add items to. Each time i select an item which is an object of a Person this person properties should be showed in textboxes. This person have person properties like age, name, sex and so on.
my listbox selection changed event only triggers one time or on new added items. It doesn't trigger when i click and an that is not just added.
Mainwindow.xaml.cs
namespace GUI_WPF_Eksamen
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
Backlog bl = new Backlog();
public MainWindow()
{
InitializeComponent();
DataContext = bl;
this.PriorityComboBox.Items.Add("High");
this.PriorityComboBox.Items.Add("Medium");
this.PriorityComboBox.Items.Add("Low");
}
private void AddToProductBackLogBtn_Click(object sender, RoutedEventArgs e)
{
this.ProductBacklogList.Items.Add(bl);
this.NameTextBox.Text = String.Empty;
}
private void ProductBacklogList_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
var item = this.ProductBacklogList.SelectedItem as Backlog;
this.NameLabel.Content = item.NAME;
this.DescriptionTextBlock.Text = item.DESCRIPTION;
this.PriorityLabel.Content = item.PRIORITY;
this.TimeLabel.Content = item.TIME;
}
private void AddToSprint_Click(object sender, RoutedEventArgs e)
{
var currentItem = this.ProductBacklogList.SelectedItem as Backlog;
this.SprintBacklogList.Items.Add(currentItem);
}
}
}
Mainwindow.xaml
<Window x:Class="GUI_WPF_Eksamen.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:GUI_WPF_Eksamen"
Title="GUI WPF application" Height="800" Width="1200">
<Window.Background>
<ImageBrush ImageSource="Images/chalkboard.jpg"/>
</Window.Background>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="69*"/>
<RowDefinition Height="700*"/>
</Grid.RowDefinitions>
<Label x:Name="Title" Content="SCRUM-BOARD XXL" HorizontalAlignment="Center" HorizontalContentAlignment="Center" Margin="15,10,5,0" VerticalAlignment="Top" Width="1172" Height="56" FontSize="36" FontStyle="Italic" FontWeight="Bold" Foreground="White"/>
<Grid HorizontalAlignment="Left" Height="680" Margin="15,10,0,0" Grid.Row="1" VerticalAlignment="Top" Width="354">
<Grid.RowDefinitions>
<RowDefinition Height="94*"/>
<RowDefinition Height="44*"/>
<RowDefinition Height="131*"/>
<RowDefinition Height="53*"/>
<RowDefinition Height="40*"/>
<RowDefinition Height="46*"/>
<RowDefinition Height="272*"/>
</Grid.RowDefinitions>
<Label Content="Navn" HorizontalAlignment="Left" Margin="0,44,0,0" VerticalAlignment="Top" Width="77" FontSize="16" Foreground="White"/>
<Label Content="Beskrivelse
" HorizontalAlignment="Left" Margin="0,10,0,0" VerticalAlignment="Top" Foreground="White" FontSize="16" Height="31" Grid.Row="1"/>
<Label Content="Prioritet" HorizontalAlignment="Left" Margin="0,7,0,0" VerticalAlignment="Top" Width="67" FontSize="16" Foreground="White" Grid.Row="3"/>
<Label Content="Estimeret tidsforbrug" HorizontalAlignment="Left" Margin="0,10,0,0" VerticalAlignment="Top" Foreground="White" FontSize="16" Grid.Row="4" Grid.RowSpan="2"/>
<TextBox x:Name="NameTextBox" HorizontalAlignment="Left" Height="23" Margin="51,52,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="303" Opacity="0.5" Text="{Binding Path=NAME}"/>
<ComboBox x:Name="PriorityComboBox" HorizontalAlignment="Left" Margin="73,12,0,0" VerticalAlignment="Top" Width="152" RenderTransformOrigin="0.5,0.5" Opacity="0.5" Grid.Row="3" SelectedItem="{Binding Path=PRIORITY}">
<ComboBox.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="0.036"/>
<TranslateTransform/>
</TransformGroup>
</ComboBox.RenderTransform>
</ComboBox>
<TextBox x:Name="TimeTextBox" HorizontalAlignment="Left" Height="23" Margin="0,6,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="204" Opacity="0.5" Grid.Row="5" Text="{Binding Path=TIME}"/>
<Label Content="time(r)" HorizontalAlignment="Left" Margin="209,38,0,0" VerticalAlignment="Top" Foreground="White" FontSize="16" Width="57" Grid.Row="4" Grid.RowSpan="2"/>
<TextBox x:Name="DescriptionTextBox" HorizontalAlignment="Left" Height="111" Margin="0,10,0,0" Grid.Row="2" TextWrapping="Wrap" VerticalAlignment="Top" Width="354" Opacity="0.5" Text="{Binding Path=DESCRIPTION}"/>
<Button x:Name="AddToProductBackLogBtn" Content="Add Backlog item" HorizontalAlignment="Left" Grid.Row="6" VerticalAlignment="Top" Width="200" Height="27" Margin="66,0,0,0" Background="White" Opacity="0.7" Click="AddToProductBackLogBtn_Click"/>
</Grid>
<Grid HorizontalAlignment="Left" Height="680" Margin="374,10,0,0" Grid.Row="1" VerticalAlignment="Top" Width="808" RenderTransformOrigin="0.459,0.431">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="79*"/>
<ColumnDefinition Width="47*"/>
<ColumnDefinition Width="76*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="209*"/>
<RowDefinition Height="131*"/>
</Grid.RowDefinitions>
<Label Content="Navn" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="1" VerticalAlignment="Top" FontSize="16" Foreground="White" Height="31" Width="47"/>
<Label Content="Beskrivelse" HorizontalAlignment="Left" Margin="10,55,0,0" Grid.Row="1" VerticalAlignment="Top" Foreground="White" FontSize="16" Height="31" Width="87"/>
<Label Content="Prioritet
" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="1" VerticalAlignment="Top" Foreground="White" FontSize="16" Height="32" Grid.Column="1" Width="66"/>
<Label Content="Estimeret tidsforbrug" Grid.Column="1" HorizontalAlignment="Left" Margin="10,55,0,0" Grid.Row="1" VerticalAlignment="Top" Foreground="White" FontSize="16" Height="31" Width="159"/>
<Label x:Name="PriorityLabel" Content="" Grid.Column="1" HorizontalAlignment="Left" Margin="90,10,0,0" Grid.Row="1" VerticalAlignment="Top" FontSize="16" Foreground="White" Width="79" Height="31"/>
<Label x:Name="TimeLabel" Grid.Column="2" HorizontalAlignment="Left" Margin="10,55,0,0" Grid.Row="1" VerticalAlignment="Top" Foreground="White" FontSize="16" Width="208" Height="31"/>
<ListBox x:Name="ProductBacklogList" HorizontalAlignment="Left" Height="353" Margin="10,55,0,0" VerticalAlignment="Top" Width="292" DisplayMemberPath="NAME" Opacity="0.505" SelectionChanged="ProductBacklogList_SelectionChanged" RenderTransformOrigin="0.5,0.5">
<ListBox.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform AngleY="-0.195"/>
<RotateTransform/>
<TranslateTransform Y="-0.497"/>
</TransformGroup>
</ListBox.RenderTransform>
</ListBox>
<ListBox x:Name="SprintBacklogList" HorizontalAlignment="Left" Height="353" Margin="10,55,0,0" VerticalAlignment="Top" Width="284" DisplayMemberPath="NAME" Grid.Column="2" Opacity="0.5"/>
<Label x:Name="NameLabel" HorizontalAlignment="Left" Margin="62,14,0,0" Grid.Row="1" VerticalAlignment="Top" Width="244" Height="27" Content="{Binding Path=NAME}" Foreground="White"/>
<Button x:Name="AddToSprint" Content="Add >>" Grid.Column="1" HorizontalAlignment="Left" Margin="54,201,0,0" VerticalAlignment="Top" Width="75" Height="20" Opacity="0.7" Click="AddToSprint_Click"/>
<TextBlock x:Name="DescriptionTextBlock" HorizontalAlignment="Left" Margin="10,86,0,0" Grid.Row="1" TextWrapping="Wrap" VerticalAlignment="Top" Height="166" Width="296" Foreground="White"/>
</Grid>
</Grid>
That way of selection changed can be accomplished easily:
Have a look here:
<Window x:Class="ListBoxSelection.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<DockPanel>
<ListBox ItemsSource="{Binding persons}" IsSynchronizedWithCurrentItem="True" DockPanel.Dock="Top">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Name}" Margin="5,0"/>
<TextBlock Text="{Binding Age, StringFormat=is {0} years old}" Margin="5,0"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<StackPanel Orientation="Horizontal" DataContext="{Binding persons}" DockPanel.Dock="Top">
<TextBlock Text="You have selected: " FontWeight="SemiBold"/>
<TextBox Text="{Binding Name, UpdateSourceTrigger=PropertyChanged}"
Margin="5,0"
FontWeight="SemiBold"
VerticalAlignment="Top"
HorizontalAlignment="Center"/>
<TextBox Text="{Binding Age, UpdateSourceTrigger=PropertyChanged}"
Margin="5,0"
FontWeight="SemiBold"
VerticalAlignment="Top"
HorizontalAlignment="Left"/>
</StackPanel>
<Button Content="Add Item" DockPanel.Dock="Top" Width="60" VerticalAlignment="Top" Margin="20" Click="btnAddItem_Click"/>
</DockPanel>
Note this down: IsSynchronizedWithCurrentItem="True"
From MSDN:
Gets or sets a value that indicates whether a Selector should keep the
SelectedItem synchronized with the current item in the Items property.
What's the next step? Display the selected item:
<StackPanel DataContext="{Binding persons}"/>
StackPanel is not an ItemsControl, it will not try to display all the items in persons but instead it will look for the selected one.
The ICollectionView interface contains a member called CurrentItem. What the IsSynchronizedWithCurrentItem does is: whenever an item is clicked on the ItemsControl, it sets the CurrentItem for the collection view. The ICollectionView also has two events: CurrentItemChanging and CurrentItemChanged. When the IsSynchronizedWithCurrentItem property is set, the ItemsControl will update the SelectedItem based on what the ICollectionView's CurrentItem is.
Further more, using UpdateSourceTrigger=PropertyChanged you will be able to update you selected item and this will be immediately displayed in the ListBox.
OK, that's about, here is the rest of the code:
public class Person : INotifyPropertyChanged
{
private string _Name;
public string Name
{
get { return _Name; }
set
{
_Name = value;
PropertyChanged(this, new PropertyChangedEventArgs("Name"));
}
}
private int _Age;
public int Age
{
get { return _Age; }
set
{
_Age = value;
PropertyChanged(this, new PropertyChangedEventArgs("Age"));
}
}
public event PropertyChangedEventHandler PropertyChanged = delegate { };
}
And the codebehind:
public partial class MainWindow : Window
{
public ObservableCollection<Person> persons { get; set; }
public Person SelectedPerson
{
get { return (Person)GetValue(SelectedPersonProperty); }
set { SetValue(SelectedPersonProperty, value); }
}
// Using a DependencyProperty as the backing store for SelectedPerson. This enables animation, styling, binding, etc...
public static readonly DependencyProperty SelectedPersonProperty =
DependencyProperty.Register("SelectedPerson", typeof(Person), typeof(MainWindow), new PropertyMetadata(null));
public MainWindow()
{
InitializeComponent();
persons = new ObservableCollection<Person>();
persons.Add(new Person() { Name = "Name1", Age = 20 });
persons.Add(new Person() { Name = "Name2", Age = 25 });
persons.Add(new Person() { Name = "Name3", Age = 30 });
this.DataContext = this;
}
private void btnAddItem_Click(object sender, RoutedEventArgs e)
{
persons.Add(new Person() { Name = "NameAdded", Age = 50 });
}
}
As you see, your SelectionChanged handler is not needed anymore.
You may be asking, what is that SelectedPerson in the code behind:
Add this binding on the ListBox:
SelectedItem="{Binding SelectedPerson}"
And in that AddToSprint_Click use the SelectedPerson to get the Person instead of directly accessing the ListBox.

Image as pushpin on maps - Windows phone 8

im trying to add a image to a windows phone 8 map, to serve as a pushpin
i have the following code on my XAML
<phone:PhoneApplicationPage
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:maps="clr-namespace:Microsoft.Phone.Maps.Controls;assembly=Microsoft.Phone.Maps"
x:Class="Cartuxa.Contactos"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot">
<Grid.Background>
<ImageBrush ImageSource="/Assets/Images/bkContacts#2x.png"/>
</Grid.Background>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel Grid.Row="0" Margin="12,17,0,28"/>
<Grid x:Name="ContentPanel" Grid.RowSpan="2" Margin="0,-6,0,6">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="127*"/>
<ColumnDefinition Width="329*"/>
</Grid.ColumnDefinitions>
<Image HorizontalAlignment="Left" Margin="18.75,57.5,0,0" VerticalAlignment="Top" Source="/Assets/Images/logo#2x.png" Stretch="Fill" Grid.ColumnSpan="2" Width="221" Height="72"/>
<TextBlock HorizontalAlignment="Left" Margin="30,152,0,0" TextWrapping="Wrap" Text="Contactos" VerticalAlignment="Top" Foreground="#FFCD3333" FontFamily="Helvetica" FontSize="36" Grid.ColumnSpan="2" Width="174"/>
<Button HorizontalAlignment="Right" Margin="0,201,-13,0" VerticalAlignment="Top" Width="255" Background="White" Height="66" BorderThickness="0" Grid.Column="1" BorderBrush="#FFFF0909">
<Grid Grid.ColumnSpan="2">
<Image Name="POI_Left" Source="/Assets/Images/POI_Gray#2x.png" RenderTransformOrigin="0.4,0.274" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="-180,0,0,0" Stretch="None"/>
<TextBlock HorizontalAlignment="Left"
Margin="13,6,-22,0"
TextWrapping="Wrap"
Text="Paços dos Condes de Basto"
VerticalAlignment="Top"
FontFamily="Helvetica"
Foreground="Black"
FontSize="14" Width="182"/>
</Grid>
</Button>
<maps:Map Name="contactosMaps" HorizontalAlignment="Left" Margin="0,271,0,0" VerticalAlignment="Top" RenderTransformOrigin="-1.737,-0.175" Grid.ColumnSpan="2" Height="290" Width="480"/>
<Button Name="Contactos_Btn1"
Click="Contactos_Btn1_Click"
HorizontalAlignment="Right"
Margin="-17,201,242,0"
VerticalAlignment="Top"
Width="255"
Background="White"
Height="65"
BorderThickness="0"
Grid.ColumnSpan="2">
<Grid Name="pushRed" Grid.ColumnSpan="2">
<Image x:Name="POI_Right" Source="/Assets/Images/POI_Red#2x.png" RenderTransformOrigin="0.4,0.274" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="-190,0,0,0" Stretch="None"/>
<TextBlock HorizontalAlignment="Left" Margin="14,6,-14,0" TextWrapping="Wrap" Text="Fundação Eugénio De Almeida" VerticalAlignment="Top" FontFamily="Helvetica" Foreground="Black" FontSize="14"/>
</Grid>
</Button>
<TextBlock HorizontalAlignment="Left" Margin="26,606,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Grid.ColumnSpan="2" Width="406" Height="22">
<Run FontFamily="Helvetica" Text="Fundação Eugénio de Almeida"/>
<LineBreak/>
<Run/>
</TextBlock>
<TextBlock HorizontalAlignment="Left" Margin="30,655,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Grid.ColumnSpan="2" Width="402" Height="85" FontFamily="Helvetica">
<Run Text="Páteo de São Miguel "/>
<LineBreak/>
<Run Text="Apartado 2001, 7001-901 Évora "/>
<LineBreak/>
<Run Text="Portugal"/>
<LineBreak/>
<Run/>
</TextBlock>
<TextBlock HorizontalAlignment="Left" Margin="30,745,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Grid.ColumnSpan="2" Width="406" Height="22" Text="Tel. (+351) 266 748 300 "/>
<TextBlock HorizontalAlignment="Left" Margin="30,773,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Grid.ColumnSpan="2" Width="406" Height="22">
<Run FontFamily="Helvetica" Text="Fax. (+ 351) 266 705 149"/>
<Run FontFamily="Helvetica"/>
<Run/>
</TextBlock>
</Grid>
</Grid>
and my .cs code is the following
public partial class Contactos : PhoneApplicationPage
{
public Contactos()
{
InitializeComponent();
Loaded +=Contactos_Loaded;
}
private void Contactos_Loaded(object sender, RoutedEventArgs e)
{
UpdateMap();
}
private void UpdateMap()
{
MapOverlay pin = new MapOverlay();
pin.Content = pushRed;
pin.GeoCoordinate = new GeoCoordinate(38.57325D, -7.90546);
pin.PositionOrigin = new Point(0, 0.5);
MapLayer pinLayer = new MapLayer();
pinLayer.Add(pin);
contactosMaps.Layers.Add(pinLayer);
contactosMaps.SetView(new GeoCoordinate(38.57325D, -7.90546), 14D);
}
private void Contactos_Btn1_Click(object sender, RoutedEventArgs e)
{
}
}
when i try to run my project, it loads the map but a few moments later i get this exception
"Additional information: Value does not fall within the expected range."
when i do the "contactosMaps.Layers.Add(pinLayer);"
can't i have that Grid with the image as a pushpin?
Use the Phone.Controls.Toolkit as described here:-
http://wp.qmatteoq.com/maps-in-windows-phone-8-and-phone-toolkit-a-winning-team-part-1/
The toolkit can be found at either of
http://phone.codeplex.com/
or
https://www.nuget.org/packages/WPtoolkit
You can then either add the image directly in your XAML as follows:-
<maps:Map Loaded="MapControl_Loaded" ZoomLevel="18" Name="MapControl">
<toolkit:MapExtensions.Children>
<toolkit:Pushpin x:Name="MyPushpin">
<toolkit:Pushpin.Template>
<ControlTemplate TargetType="toolkit:Pushpin">
<StackPanel>
<Image Source="/Images/MapScreen/MapScreenCurrentLocationPin.png" Stretch="Uniform" Width="50" Height="50" HorizontalAlignment="Center"/>
</StackPanel>
</ControlTemplate>
</toolkit:Pushpin.Template>
</toolkit:Pushpin>
</toolkit:MapExtensions.Children>
</maps:Map>
or you can add it in C# as follows:-
MapOverlay overlay = new MapOverlay
{
GeoCoordinate = myMap.Center,
Content = new Ellipse
{
Fill = new SolidColorBrush(Colors.Red),
Width = 40,
Height = 40
}
};
MapLayer layer = new MapLayer();
layer.Add(overlay);
myMap.Layers.Add(layer);
You should be able to add a Grid with an image instead of an ellipse as shown above.
Let me know if this worked for you.

Accessing items in DataTemplate using Visual Tree Helper in ListBox

I have the following DataTemplate:
<DataTemplate x:Key="ToDoListBoxItemTemplate">
<Grid x:Name="item2Expanded" HorizontalAlignment="Left" VerticalAlignment="Top" Width="480" Background="{Binding Converter={StaticResource RowColour}}" MinHeight="81">
<StackPanel HorizontalAlignment="Left" VerticalAlignment="Top" Width="420" Margin="60,0,0,0">
<TextBox x:Name="taskTitle" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding ItemName}" VerticalAlignment="Top" Width="420" Background="{x:Null}" BorderBrush="{x:Null}" CaretBrush="#FF0080FF" SelectionBackground="#FFCFCFCF" Foreground="#FF4E4E4E" BorderThickness="3,3,3,6" FontSize="29.333" Style="{StaticResource listTextBoxTemplate}" InputScope="Text" SelectionForeground="#FF4E4E4E" KeyUp="taskTitle_KeyUp" LostFocus="taskTitle_LostFocus" Tap="taskTitle_Tap" IsReadOnly="True" Margin="0,1,0,0" DoubleTap="taskTitle_DoubleTap"/>
<TextBox x:Name="taskDetail" HorizontalAlignment="Left" TextWrapping="Wrap" Text="Tea is an essential English beverage, it has a nice calming effect, and is often served alongside biscuits." VerticalAlignment="Top" Width="420" Background="{x:Null}" BorderBrush="{x:Null}" CaretBrush="#FF0080FF" SelectionBackground="#FFCFCFCF" Foreground="#FF878787" BorderThickness="3,0,3,6" FontSize="21.333" Style="{StaticResource listTextBoxTemplate}" InputScope="Text" SelectionForeground="#FF878787" Margin="0,-20,0,0" KeyUp="taskDetail_KeyUp" LostFocus="taskDetail_LostFocus" Padding="2,5,2,2" IsHitTestVisible="False"/>
<Grid Height="170" Margin="0,-20,0,0">
<Button x:Name="chooseDateButton" Content="27/06/2013" HorizontalAlignment="Left" Margin="6,13,0,0" VerticalAlignment="Top" BorderBrush="#FF959595" Foreground="#FF959595" Width="157" HorizontalContentAlignment="Left" FontSize="20" Style="{StaticResource selectorButtonTemplate}"/>
<Button x:Name="chooseTimeButton" Content="12:00" HorizontalAlignment="Left" Margin="146,13,0,0" VerticalAlignment="Top" BorderBrush="#FF959595" Foreground="#FF959595" Width="99" HorizontalContentAlignment="Left" FontSize="20" Style="{StaticResource selectorButtonTemplate}"/>
<Button x:Name="setOrClearButton" Content="REMIND ME" HorizontalAlignment="Left" Margin="228,13,0,0" VerticalAlignment="Top" BorderBrush="#FF959595" Foreground="White" Width="180" FontSize="20" Background="#FF959595" Style="{StaticResource greyButtonTemplate}"/>
<Button x:Name="deleteButton" Content="DELETE TASK" HorizontalAlignment="Left" Margin="6,85,0,0" VerticalAlignment="Top" BorderBrush="#FFEE4747" Foreground="White" Width="180" FontSize="20" Background="#FFEE4747" Style="{StaticResource redButtonTemplate}"/>
<Image x:Name="retractButton" Margin="347,107,21,11" Source="/Assets/retract.png" Stretch="Fill" Tap="retractButton_Tap"/>
</Grid>
</StackPanel>
<CheckBox x:Name="checkBox" IsChecked="{Binding IsComplete, Mode=TwoWay}" Content="" HorizontalAlignment="Left" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="{x:Null}" Width="72" BorderThickness="0" Template="{StaticResource checkBoxTemplate}" Checked="checkBox_Checked" Unchecked="checkBox_Unchecked"/>
</Grid>
</DataTemplate>
Where the Grid item2Expanded is placed dynamically in a ListBox (Name="allToDoItemsListBox"). Text is added to each item via bindings.
The image retractButton has Tap="retractButton_Tap", As shown in the code:
private void retractButton_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
if (isItemExpanded == true)
{
// Compacts current item
itemGrid.Height = taskTitle.ActualHeight; // Restores itemGrid height to fit only taskTitle
taskTitle.IsReadOnly = true; // taskTitle becomes only double-tap editable, single tap to expand once more
taskDetail.IsHitTestVisible = false; // Stops overlapping taps
isItemExpanded = false;
}
// Adds the event handler for single tap event
tapTimer.Tick += new EventHandler(tapTimer_Tick);
tapTimer.Start();
}
private void tapTimer_Tick(object sender, EventArgs e)
{
// Stop timer
tapTimer.Tick -= new EventHandler(tapTimer_Tick);
tapTimer.Stop();
// Rest of the single tap function
if (isItemExpanded == false)
{
taskDetail.IsHitTestVisible = true;
taskDetail.IsEnabled = false;
// Expands current item
itemGrid.Height = double.NaN; // Sets itemGrid height to auto
isItemExpanded = true;
// Yeah... don't ask.
// Stops temporary text highlighting/auto jumping to keyboard
taskTitle.IsEnabled = false;
taskTitle.IsEnabled = true;
taskDetail.IsEnabled = true;
}
}
But I cannot access itemGrid, taskTitle, or taskDetail for this specific item. And I have no idea how to pass them to the tapTimer_Tick function.
I have been able to use the Tag="{binding itemID}" on elements, but that still hasn't allowed me to solve this issue.
How do I find the grid item2Expanded that the Tap originated from, and then access elements in the same grid by name?
If I want to access the same element as was clicked, then it's easy:
private void taskTitle_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
TextBox taskTitle = (TextBox)sender;
taskTitle.IsEnabled = false;
}
I've been trying to work out how to use Visual Tree Helper to solve this problem, but I have no idea how to do it.

Categories