We Keep Coding

how to select the item of list veiw data template in wpf?

I made a list view, and i used a data Template as you seeing
below and now i want to select the Which item,the user selected and put the text of the selected item textblock to a variable
<ListView.ItemTemplate>
<DataTemplate >
<Border CornerRadius="20"
BorderThickness="2"
BorderBrush="Red"
Width="70"
Height="70"
Margin="5,5">
<Button x:Name="calender_btn"
Background="Transparent"
BorderBrush="Transparent"
Style="{StaticResource calender_btn_style}"
Click="calender_btn_Click">
<TextBlock x:Name="calender_txt_block"
Text="{Binding _outputdate}"
Foreground="White"
Width="55"
FontSize="14"
Margin="3,5"
TextWrapping="Wrap"
VerticalAlignment="Center"
HorizontalAlignment="Center"
TextAlignment="Center"
>
</TextBlock>
<Button.Resources>
<Style TargetType="Border">
<Setter Property="CornerRadius" Value="20"/>
</Style>
</Button.Resources>
</Button>
</Border>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel/>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
I have no idea how I can do it, because I am new in wpf, if you know how I can do it.

Depending on how your data looks like, you probably get a data object to each button that contains the text. You can find that object in the buttons data context.
private void calender_btn_Click(object sender, RoutedEventArgs e)
{
var dataObject = ((Button)sender).DataContext;
}

If you are using ItemsSource you can get the selected value by binding to ListView SelectedItem (SelectedValue in some cases).
SelectedItem="{Binding SelectedData, Mode=TwoWay}"
Assuming that you have SelectedData property in your DataContext with same type as your data in the shown collection.
Google for MVVM

How to hide a child element from Xceed Magnifier?

I am able to zoom using Magnifier (Xceed's control toolkit).
I have multiple controls in Grid that I want to get rid off imageEditor and ListBox controls from Magnifying Glass when it gets zoom.
My code is below.
<Grid>
<wpfMagnifier:MagnifierManager.Magnifier>
<wpfMagnifier:Magnifier x:Name="magnifiyingGlass" Visibility="Hidden"
FrameType="Circle" Radius="240" ZoomFactor=".4" BorderBrush="#9cc63e" BorderThickness="9">
</wpfMagnifier:Magnifier>
</wpfMagnifier:MagnifierManager.Magnifier>
<Image x:Name="cvT" >
</Image>
<imageEditor:UserControl1 x:Name="UserControlID1" Points="{Binding Points}" IsClosedCurve="{Binding IsClosedCurve}" />
<ListBox ItemsSource="{Binding Points}" ItemContainerStyle="{StaticResource PointListBoxItemStyle}" x:Name="ItemsContainer"
PreviewMouseLeftButtonDown="ItemsContainer_PreviewMouseLeftButtonDown" MouseMove="ItemsContainer_MouseMove" PreviewMouseLeftButtonUp="ItemsContainer_PreviewMouseLeftButtonUp">
<ListBox.Template>
<ControlTemplate>
<Canvas IsItemsHost="True"/>
</ControlTemplate>
</ListBox.Template>
</ListBox>
</Grid>
How to implement it?

C# WPF: How to keep keyboard focus in main window?

I am working on a simple image viewer.
It contains a viewbox which shows the current image.
Below I added a thumbnail strip created by a wrappanel inside a listview which contains the thumbnails in viewboxes again.
I am able to switch the current image by key events (code excample "space", in real space and arrow keys). By clicking in one of the thumbs it is also possible to update the current image.
Unfortunately, whenever I select a thumb in the Listview, the Mainwindow looses keyboard focus and I am not able to use the keys anymore to switch the images.
I tried all solutions found in the net, but nothing really works, now I am completely lost.
Any ideas.
...
<Window.CommandBindings>
<CommandBinding Command="{x:Static local:MainWindow.command1}" CanExecute="command1CanExecute" Executed="handlecommand1"/>
</Window.CommandBindings>
<Window.InputBindings>
<KeyBinding Command="{x:Static local:MainWindow.command1}" Key="Space" />
</Window.InputBindings>
...
<DockPanel>
<ListView x:Name="ThumbSlider" ... Some Settings ... Focusable="False" MouseUp="ListboxMouseUp">
<ListView.Resources>
<Style TargetType="ListViewItem">
<Setter Property="Focusable" Value="False"/>
</Style>
</ListView.Resources>
<ListView.ItemTemplate>
<DataTemplate>
<Viewbox ... Some Settings ... ScrollViewer.VerticalScrollBarVisibility="Disabled" Height="120" Width="120" Focusable="False">
<Image Source="{Binding Path=ThumbImage}"></Image>
</Viewbox>
</DataTemplate>
</ListView.ItemTemplate>
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel IsItemsHost="True" Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListView>
<Viewbox x:Name="CurrentImageBox" DockPanel.Dock="Top" >
<Image Source="{Binding Path=CurrentImage}"/>
</Viewbox>
...
</DockPanel>

Drawing a border only on the last item inside my listview

I'm trying to create a control like this:
The control denotes the status completion of 4 tile objects (in the above attached pic 2 is completed and 2 is not)
For achieving this I have created a ListView with horizontal orientation, and I'm creating a datatemplate which has some borders inside.Not sure whether this is the right approach or whether a simpler approach is possible, however the issue I'm facing is the following:
I'm not able to close the border of the last item..this is because I have 4 items inside my itemsource of the listview and each item draws a border to it's left. Question is how do I specifically draw the right border for the last item.
The line which passess through the middle should actually go behind the gray shading..how do I achieve that?
Code is as below:
<Style x:Key="FishBoneStyle" TargetType="{x:Type Border}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Completed}" Value="True">
<Setter Property="Background" Value="DarkGray"/>
<Setter Property="Margin" Value="0,3,-2,3"/>
</DataTrigger>
</Style.Triggers>
</Style>
<DataTemplate x:Key="FishBoneTemplate">
<Grid Height="25">
<Border BorderThickness="1,0,0,0" BorderBrush="Black" Height="25" HorizontalAlignment="Left" VerticalAlignment="Stretch"/>
<Border Style="{StaticResource FishBoneStyle}" x:Name="FishBoneBorder" Width="25">
</Border>
</Grid>
</DataTemplate>
<!-- The Main Grid-->
<Grid Grid.Row="1" Height="30" Width="130" HorizontalAlignment="Left">
<ListView BorderThickness="0,0,0,0" BorderBrush="Black" ItemsSource="{Binding ProgressTiles}" ItemTemplate="{StaticResource FishBoneTemplate}">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"></StackPanel>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
</ListView>
<!-- The line which passess through the center-->
<Border VerticalAlignment="Center" HorizontalAlignment="Left" Width="100" Margin="3,0,2,0" BorderBrush="Black" BorderThickness="1"></Border>
</Grid>
..and here is the model which is lying inside an observable collection in my viewmodel.There will be always 4 of them.
public class ProgressTile : INotifyPropertyChanged
{
private bool _completed;
public bool Completed
{
get { return _completed; }
set
{
_completed = value;
InvokePropertyChanged("Completed");
}
}
public event PropertyChangedEventHandler PropertyChanged;
public void InvokePropertyChanged(string e)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null) handler(this, new PropertyChangedEventArgs(e));
}
}
Please can you suggest how to get a look consistent to the attached picture. Also can you please suggest how to solve the issue with drawing a border for the last item and sending the line passing through the middle to background?

Can be done much simpler:
<Window x:Class="So17362172FishBoneProgressBar.MainWindow" x:Name="root"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Fish Bone Progress Bar" Height="350" Width="525" SnapsToDevicePixels="True">
<Grid Width="100" Height="20">
<TickBar Fill="Gray" TickFrequency="25" Placement="Top"/>
<TickBar Fill="Gray" TickFrequency="25" Placement="Bottom"/>
<Line Stroke="Gray" X1="0" Y1="10" X2="100" Y2="10"/>
<ItemsControl ItemsSource="{Binding Tiles, ElementName=root}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Rectangle x:Name="rect" Fill="Gray" VerticalAlignment="Center" Width="25" Height="10"/>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding Completed}" Value="False">
<Setter TargetName="rect" Property="Visibility" Value="Collapsed"/>
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
</Window>
ListView is unnecessary. Much simpler ItemsControl is enough for this.
Ticks can be drawn with TickBar. As inner ticks are drawn smaller, two tick bars are put over each other (it shouldn't be an issue, as these are very lightweight).
Order of drawing is determined by order in the logical tree. If you want something to be drawn over another, you put it into XAML lower.
Grid is unnecessary if it contains only one control.

Changing border color when a control is selected with c# on windows 8 app store

I have a gridview control with images and text with this xaml:
<Grid Grid.Column="1" Margin="0,40,30,0" >
<GridView x:Name="celebGridView" Margin="0,0,0,0" Padding="0,0,0,0">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<WrapGrid Orientation="Horizontal" MaximumRowsOrColumns="3"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.Header>
<StackPanel Width="480" Margin="0,4,14,0">
<StackPanel Orientation="Horizontal" Margin="0,0,0,10">
<TextBlock Text="Most Viewed Celebs" Foreground="black" FontSize="25"/>
<Image Source="/images/Navigation-Right.png" Margin="10,0,0,0"/>
</StackPanel>
</StackPanel>
</GridView.Header>
<GridView.ItemTemplate>
<DataTemplate>
<StackPanel>
<Image Source="{Binding ImageBitmap}" />
<TextBlock HorizontalAlignment="Center" Text="{Binding Name_}" Foreground="Black"/>
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</Grid>
and i get this purple border around the selected items in the gridview below
How can i override this behaviour, i need to change the color to a custom color (#fdeb01).

You could edit the ItemContainerStyle for the GridView. The easiest way is to use Blend and find the SelectedBorder element and change stroke brush to color you want.

Aside from using Expression Blend, note that Metro ListView selection color modification in XAML is also valid for GridViewItems so changing the following:
<SolidColorBrush x:Key="ListViewItemSelectedBackgroundThemeBrush" Color="#fdeb01"> </SolidColorBrush>
<SolidColorBrush x:Key="ListViewItemPointerOverBackgroundThemeBrush" Color="#ffffff"></SolidColorBrush>
<SolidColorBrush x:Key="ListViewItemSelectedPointerOverBackgroundThemeBrush" Color="#fdeb01"></SolidColorBrush>
<SolidColorBrush x:Key="ListViewItemSelectedPointerOverBorderThemeBrush" Color="#fdeb01"></SolidColorBrush>
will also affect the gridview.