Windows 8 - GridView does not return SelectedItem when a button inside an item is clicked - xaml

I am working on a Win8 Metro Application. I am using a GridView. In GridView's ItemTemplate, I have 3 buttons (Button1, Button2, Button3). So, on my screen, if I have 5 GridView Items at a time, then I will see 5x3 = 15 buttons.
The problem is that if any of these buttons is clicked, I am unable to trace parent GridView Item.
Amongst GridView's properties, "SelectedIndex" (or SelectedItem) properties are there. However, its value is set when GridView item is clicked, (not when a button inside GridViewItem is clicked). So, on clicking button, SelectedIndex remains -1.
How can I find out on ButtonClick that who is the parent item of this button?

From reading your replies in comments, it seems like you want to get the reference to the underlying data item rather than the grid item itself. That being the case, do the following in your button click handler...
Void Button_Click(sender, e)
{
var btn = (Button)sender;
var dc = btn.DataContext as MyBoundType; // don't forget to check for null!
var itemId = dc.Id; // assuming your object has an Id field
}

Bind the CommandParameter of the button to the parent item like this:
<Button
Command="{Binding RemoveCommand}"
CommandParameter="{Binding RelativeSource=
{RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"
/>

Related

how to disable auto tab after pressing enter and losing focus of textbox

I have an Event Handler for a keyDownEvent in a TextBox. Now when I press Enter this Event Handler changes the Visibility to Collapsed and the TextBox hides. the Problem with it is that this obviously unfocus the TextBox and foucus sth. else in my App. How can I disable this autofocus of another element and focus nothing?
I have tried the following but i am really screwed.
if (e->Key == Windows::System::VirtualKey::Enter) {
this->mode = ITEM_MODE::SELECT; // will Change Visibility to Collapsed
FocusManager::TryMoveFocus(FocusNavigationDirection::None);
e->Handled = true;
}
Thanks for your help! <3
how to disable auto tab after pressing enter and losing focus of textbox
Derive from official document,
UseSystemFocusVisuals used to get or set a value that indicates whether the control uses focus visuals that are drawn by the system or those defined in the control template.
You could set control UseSystemFocusVisuals property as False. Then next control will not be focused by system.
<StackPanel Orientation="Vertical" Name="RootLayout" IsTapEnabled="False" >
<TextBox HorizontalAlignment="Stretch" Height="44" KeyDown="TextBox_KeyDown" />
<Button Content="FouceElement" UseSystemFocusVisuals="False"/>
<Button Content="NextBtn" UseSystemFocusVisuals="False"/>
</StackPanel>
In case you just don't want the auto-focused item to have focus indicator shown, you can change the Focus type to FocusState.Pointer.
Example (C#):
object focusedElement = FocusManager.GetFocusedElement();
((Control)focusedElement).Focus(FocusState.Pointer); // This will hide focus indicator

Mutually exclusive selection of two listviews

I've implemented a UWP SplitView similar to the one made by Diederik Krols. I prefer the approach of using a ListView over using RadioButtons as shown by Jerry Nixon's implementation of the SplitView.
However, I have a problem when I add secondary commands at the bottom of the SplitView, which Diederik doesn't do. These secondary commands are implemented by another ListView bound to a collection of Commands. So I have TWO ListViews that should only allow ONE item to be selected among them at a time.
I've tried two things:
I've bound the SelectedItem property of both ListViews to the same object. The idea was that maybe ListView doesn't display a selection if SelectedItem is not in the list bound to ItemsSource. Sadly, it simply goes on displaying the last selected item.
I've bound each ListView's SelectedItem to its own property. When one of the ListViews' item is selected, the SelectedItem of the other property is set to 'null' by the ViewModel. This produces the same result as in 1.
Any ideas on how to solve this problem?
I had the same problem.
I have a fix, but I'm not that proud of it ;) it's a dirty hack and I'm hoping other solutions will present itself so I can change it too.
But here it is:
First the listviews hook up to the SelectionChanged event even though we also bind the selected item to the viewmodel ( full code shown here https://github.com/AppCreativity/Kliva/blob/master/src/Kliva/Controls/SidePaneControl.xaml )
<ListView x:Name="TopMenu"
SelectionChanged="OnTopMenuSelectionChanged"
Background="Transparent"
ItemsSource="{x:Bind ViewModel.TopMenuItems}"
ItemTemplateSelector="{StaticResource MenuItemTemplateSelector}"
ItemContainerStyle="{StaticResource MenuItemContainerStyle}"
SelectedItem="{x:Bind ViewModel.SelectedTopMenuItem, Mode=TwoWay, Converter={StaticResource XBindItemCastingConverter}}"
Grid.Row="0" />
In that SelectionChanged, we'll deselect the 'other' listviews selection! ( full code shown here https://github.com/AppCreativity/Kliva/blob/master/src/Kliva/Controls/SidePaneControl.xaml.cs )
Note that we need to keep track that we are already in a deselecting process otherwise we'll end up with an endless loop. This is done with the _listViewChanging field.
private void OnBottomMenuSelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (!_listViewChanging)
{
_listViewChanging = true;
TopMenu.SelectedIndex = -1;
_listViewChanging = false;
}
}
Last thing to do is making sure we handle the selection and clear it again in the viewmodel for next itteration ( full code shown here https://github.com/AppCreativity/Kliva/blob/master/src/Kliva/ViewModels/SidePaneViewModel.cs )
public MenuItem SelectedBottomMenuItem
{
get { return _selectedBottomMenuItem; }
set
{
if (Set(() => SelectedBottomMenuItem, ref _selectedBottomMenuItem, value))
{
if (value != null)
{
if (string.IsNullOrEmpty(SelectedBottomMenuItem.Title))
HamburgerCommand.Execute(null);
if (SelectedBottomMenuItem.Title.Equals("settings", StringComparison.OrdinalIgnoreCase))
SettingsCommand.Execute(null);
SelectedBottomMenuItem = null;
}
}
}
}

Reset SelectedItem in LongListSelector after selection

I'm using Caliburn.Micro and the LongListSelector. Because binding SelectedItem is a problem I act on the SelectionChanged event. Problem is, after returning to the list, when I click the same item again, it is already selected. So the event doesn't fire. I could set the SelectedIndex to -1 or something, but in Caliburn.Micro I can't access UI controls. That's the point of MVVM, isn't it?! :)
Here's my XAML
<LongListSelector x:Name="NewsItems"
ItemsSource="{Binding NewsItems}"
cal:Message.Attach="[Event SelectionChanged] = [NavigateToArticle($eventArgs)]" />
How to solve this? How can I reset the SelectedItem when I can't access the LongListSelector from code?
Thanks!
You have to put your LongListSelector SelctionMode="Multiple",
or
You can get it using Gesture Tap event.
Did not understood real problem but
I think you can solve your problem if selection change event fire every time when user select item-
private void productList_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
LongListSelector productList= (LongListSelector)sender;
if (productList.SelectedItem == null)
return;
//Write your code here
//For Tapping many times..
productList.SelectedItem = null;
}
The above code will make selection change event to fire on selection of same item every time.

click a textblock without selecting the parent listview item

I'm developing a windows store application with C# and XAML. I am using a ListView to display the collection of data.
Inside the ListView I have a data template which has grids and a TextBlock in the grid. I want to tap/click the TextBlock and give action without selecting the parent ListView item as I already have event to handle the selected ListView item. I don't want both to overlap.
Thanks in advance for any response.
So you want to be able to select the ListViewItem when tapping one part of it, but not the TextBlock? If this is the case, in the TextBlock's Tapped event add e.Handled = true;. This should make it so that it isn't further routed up to the parent ListView.
The other thing you can do (which will likely be a more general solution to whatever you want to do with your ListViewItems) is to not use thing SelectionChanged event and instead handle everything with ItemClick. You can then deduce whether the OriginalSource of the event is indeed your TextBlock. Then, if it's not the TextBlock, change the parent ListView's SelectedItem.
An example for chceking the OriginalSource
public static void ItemClickEvent(object sender, ItemClickEventArgs e)
{
if(e.OriginalSource is TextBlock)
DoNothingOrMaybeTextBlockEvent();
else
{
ListView.SelectedItem = e.ClickedItem;
}
}
Hope this helps.
Edit: Added some example code for the OriginalSource check

Let ListView scroll to selected item

I have a WinRT/C#/XAML app with a view that has a vertical ListView of items. Depending on the amount of items the ListView shows a vertical scrollbar. Here's the XAML definition:
<UserControl.Resources>
<CollectionViewSource
x:Name="myViewSource"
Source="{Binding myViewModel.Items}" />
</UserControl.Resources>
...
<ListView
x:Name="myListView"
ItemsSource="{Binding Source={StaticResource myViewSource}}"
SelectedItem="{Binding SelectedItem, Mode=TwoWay}">
</ListView>
Now everytime I navigate to this view, the selected item of the ListView is chosen by setting the databound SelectedItem property in the view model from code behind (OnNavigatedTo). My problem: the ListView doesn't scroll automatically to this selected item. The scrollbar remains at the top of the ListView and the user has to scroll manually to see the selected item.
I tried to execute myListView.ScrollIntoView(MyViewModel.SelectedItem); after setting the SelectedItem in the code behind (in OnNavigatedTo), but it doesn't work. The scrollbar remains at the top.
I'm aware of this thread on SO: Scroll WinRT ListView to particular group .
This seems to be a similar problem. But when I walk the visual tree of the ListView manually or with the WinRT XAML Toolkit, it doesn't find a ScrollViewer (returns null instead).
Thanks to Filip I noticed that calling ScrollIntoView() in OnNavigatedTo() was too early, because the ListView control is not loaded yet in this place.
The first solution idea was to bind the Loaded event of the ListView:
myListView.Loaded += (s, e) =>
myListView.ScrollIntoView(MyViewModel.SelectedItem);
Unfortunately that causes a nasty visual effect, where current ListView items overlap with the selected item for parts of a second, before everything is rearranged well.
The final solution I found is to call ScrollIntoView() asynchronously via the Dispatcher of the view:
myListView.Loaded += (s, e) => Dispatcher.RunAsync(CoreDispatcherPriority.Normal,
() => myListView.ScrollIntoView(MyViewModel.SelectedItem));
With this solution the layouting works fine.
I had a similar need and resolved it in a slightly different manner. I subscribed to the SelectionChangedEvent from the ListView and performed the scrolling within the handler.
XAML:
<ListView x:Name="myListView" SelectionChanged="myListView_SelectionChanged" ...>
</ListView>
Code:
private void myListView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
myListView.ScrollIntoView(myListView.SelectedItem);
}