I'm trying to load data into a GridView after a TextBlock from another GridView on the page has been tapped/clicked. The first GridView containing the list of TextBlocks loads correctly.
Here is my XAML code for both GridViews, my Bindings seem to be correct:
<GridView x:Name="CourseNoGridView" Margin="50,50,0,0" Grid.Row="1" VerticalAlignment="Top" Height="568" ItemsSource="{Binding Distinct_CourseNo}" SelectionMode="Single" Padding="0,0,0,10" HorizontalAlignment="Left" Width="525" SelectionChanged="CourseNoGridView_SelectionChanged">
<GridView.ItemTemplate>
<DataTemplate>
<Border BorderBrush="White">
<TextBlock x:Name="CourseNoTextBlock" Text="{Binding CourseNo}" TextWrapping="NoWrap" FontSize="24" Width="200" Height="Auto" Padding="10" Tapped="CourseNoTextBlock_Tapped"/>
</Border>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
<GridView x:Name="SectionsGridView" Margin="580,50,0,0" Grid.Row="1" VerticalAlignment="Top" Height="568" ItemsSource="{Binding Clicked_CourseNo_Sections}" SelectionMode="Single" Padding="0,0,0,10" HorizontalAlignment="Left" Width="776" SelectionChanged="CourseNoGridView_SelectionChanged">
<GridView.ItemTemplate>
<DataTemplate>
<Border BorderBrush="White">
<TextBlock x:Name="SectionTextBlock" Text="{Binding Get_Section}" TextWrapping="NoWrap" FontSize="24" Width="200" Height="Auto" Padding="10"/>
</Border>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
Here is my code for handling the clicking/tapping of an item in the first GridView:
private void CourseNoGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
clickedSection = (Sections)e.AddedItems[0];
}
private void CourseNoTextBlock_Tapped(object sender, TappedRoutedEventArgs e)
{
this.Clicked_CourseNo_Sections = (from s in Roster_Sections
where s.CourseNo.Equals(clickedSection.CourseNo)
select s).ToList();
}
What you want to do is use an ObservableCollection and bind your your Grid View to this. Then in your "Tapped" event handler you clear the existing items from this collection and add the new items.
Something like this:
private readonly ObservableCollection<Sections> currentSections = new ObservableCollection<Sections>();
//This is what we bind to
public ObservableCollection<Sections> CurrentSections { get { return currentSections; } }
private void CourseNoGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
clickedSection = (Sections)e.AddedItems[0];
}
private void CourseNoTextBlock_Tapped(object sender, TappedRoutedEventArgs e)
{
var courseSections = (from s in Roster_Sections
where s.CourseNo.Equals(clickedSection.CourseNo)
select s);
CurrentSections.Clear();
CurrentSections.AddRange(courseSections);
}
There's some documentation here:
http://msdn.microsoft.com/en-us/library/windows/apps/hh758320.aspx
It seems like adding the last line of code below fixed the problem.
private void CourseNoTextBlock_Tapped(object sender, TappedRoutedEventArgs e)
{
this.Clicked_CourseNo_Sections = (from s in Roster_Sections
where s.CourseNo.Equals(clickedSection.CourseNo)
select s).ToList();
SectionsGridView.ItemsSource = Clicked_CourseNo_Sections;
}
Related
I have a combobox to select the background color of a given application object. I'm filling the combobox with the code below, but I don't know how to retrieve the selected value to change the background color of the other object. Any help is most welcome. Thanks.
XAML
<ComboBox x:Name="cbxBackgroundColor" SelectionChanged="cbxBackgroundColor_SelectionChanged" >
<ComboBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Rectangle Fill="{Binding Name}" Width="32" Height="32" VerticalAlignment="Center" />
<TextBlock Text="{Binding Name}" Margin="10, 0, 0, 0" VerticalAlignment="Center" FontSize="12"/>
</StackPanel>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
Code Behind
public VideoPage()
{
this.InitializeComponent();
cbxBackgroundColor.ItemsSource = typeof(Colors).GetProperties();
}
private void cbxBackgroundColor_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
// Code to set MyObject.Background with cbxBackgroundColor.SelectedItem
}
The following code works in wpf.
private void cbxBackgroundColor_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
Color selectedColor = (Color)(cbxBackgroundColor.SelectedItem as PropertyInfo).GetValue(null, null);
this.Background = new SolidColorBrush(selectedColor);
or
MyObject.Background = new SolidColorBrush(selectedColor);
}
I have an textbox and listbox with persons names. I want to type the name in the textbox and it should update the Listbox information. But I don't know how to do it. How should I do it?
I would like to filter the listbox rows when something is written in the textbox.
MainWindow.xaml code:
<ListBox HorizontalAlignment="Left" Height="127" ItemsSource="{Binding Persons}" Name="PersonLstbox"
Margin="10,22,0,0" VerticalAlignment="Top" Width="197">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding FirstName}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Textbox code:
<TextBox Name="searchpersonbx" HorizontalAlignment="Left" Height="23" Margin="420,150,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120" TextChanged="searchpersonbx_TextChanged"/>
MainWindow.xaml.cs code:
private void searchpersonbx_TextChanged(object sender, TextChangedEventArgs e)
{
}
you can modify your code as below:-
Here I have used StartsWith() to get all the strings in specified order
your user name list
List<string> userName = new List<string>();
TextChanged Event
private void searchpersonbx_TextChanged(object sender, TextChangedEventArgs e)
{
string text = searchpersonbx.Text;
List<string> filteredUserName = userName.Select(x => x.StartsWith(text)).ToList();
listBox.ItemsSource = filteredUserName;
}
In Windows Universal app, I have a pivot table which every tab content have gridview, gridview items are multi select mode,
What I want that if any one item once checked (selected), then it unable to unselect(uncheck)
<Grid DataContext="{Binding Path=Value}">
<GridView x:Name="categoryItemsGV"
Margin="5,5,0,0"
SizeChanged="categoryItemsGV_SizeChanged"
IsItemClickEnabled="True"
ItemClick="categoryItemsGV_ItemClick"
SelectionMode="Single"
ItemsSource="{Binding}">
<GridView.ItemContainerStyle>
<Style TargetType="GridViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<!--<Setter Property="VerticalContentAlignment" Value="Center"/>-->
</Style>
</GridView.ItemContainerStyle>
<GridView.ItemTemplate>
<DataTemplate>
<Grid Width="195" Height="43" Margin="3">
<StackPanel Width="193" Height="40" Background="Gray" Opacity="0.5" HorizontalAlignment="Right" VerticalAlignment="Bottom" />
<StackPanel Orientation="Horizontal" Width="193" Height="40" Padding="7,7,0,0" Background="#FDFCC2" HorizontalAlignment="Left" VerticalAlignment="Top">
<TextBlock Text="{Binding ProductOptionLineName}" FontSize="18" MaxLines="1" TextTrimming="CharacterEllipsis" Visibility="{Binding Converter={StaticResource langToVisibilityConverter}, ConverterParameter='CH', Mode=OneWay}">
</TextBlock>
<TextBlock Text="{Binding ProductOptionLineNameEn}" FontSize="18" MaxLines="1" TextTrimming="CharacterEllipsis" Visibility="{Binding Converter={StaticResource langToVisibilityConverter}, ConverterParameter='EN', Mode=OneWay}"/>
<TextBlock Text="{Binding ExtraPriceString}" FontSize="18" Margin="2,0,0,0"></TextBlock>
</StackPanel>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</Grid>
private async void categoryItemsGV_ItemClick(object sender, ItemClickEventArgs e)
{
var item = e.ClickedItem as ProductOptionLineModel;
}
We can use the SelectRange(ItemIndexRange) method to selects a block of items described by the ItemIndexRange.
When you call SelectRange(ItemIndexRange), all items in the specified range are selected, regardless of their original selection state. You can select all items in a collection by using an ItemIndexRange with a FirstIndex value of 0 and a Length value equal to the number of items in the collection.
For more info, see Remarks of the SelectRange(ItemIndexRange).
We can use the ItemClick to get which item is be clicked. Then we can add the SelectionChanged event and set the number of the clicked item to the SelectRange method.
For example:
private int number;
private void categoryItemsGV_ItemClick(object sender, ItemClickEventArgs e)
{
var item = e.ClickedItem as ProductOptionLineModel;
number = ProductOptionLineModels.IndexOf(item);
}
private void categoryItemsGV_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
categoryItemsGV.SelectRange(new ItemIndexRange(number, 1));
}
If we want to keep item selected as it was already selected, use below approach.
private async void categoryItemsGV_ItemClick(object sender, ItemClickEventArgs e)
{
var item = e.ClickedItem as ProductOptionLineModel;
GridView gv = sender as GridView;
gv.SelectedItems.Remove(item);
}
and if we want to keep item deselect on click (prevent deselected) for validation purpose. used below approach.
private async void categoryItemsGV_ItemClick(object sender, ItemClickEventArgs e)
{
var item = e.ClickedItem as ProductOptionLineModel;
await _viewModel.DialogService("FirstRequireMinOption", "", true);
GridView gv = sender as GridView;
gv.SelectedItems.Add(item);
}
I am trying to detect which item in a listview is focused, but I am not getting the events detected. I am developing for Xbox One UWP, so I cannot use mouse or keyboard events, only focus can be used.
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical" GotFocus="StackPanel_GotFocus" >
<StackPanel Name="Imagestack" Orientation="Horizontal">
<Image Source="{Binding Image}" Height="144" Width="256" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Title}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
private void StackPanel_GotFocus(object sender, RoutedEventArgs e)
{
Debug.WriteLine("Image focus");
Image img = sender as Image;
Bgimage.Source = img.Source;
}
You should register to the ListView.GotFocus event.
The OriginalSource from the event parameter will be the ListViewItem which has received the focus. You can then retrieve the item content using ListViewItem.Content.
XAML:
<ListView x:Name="list" GotFocus="list_GotFocus">
<ListView.ItemTemplate>...</ListView.ItemTemplate>
</ListView>
Code behind:
private void list_GotFocus(object sender, RoutedEventArgs e)
{
var focusedItem = (e.OriginalSource as ListViewItem)?.Content;
}
You don't need to get focus state to get data from the clicked ListViewItem, the ItemClick event of the ListView may be what you're looking for:
<ListView x:Name="LV_Items"
IsItemClickEnabled="True"
ItemClick="LV_Items_ItemClick"
>
</ListView>
private void LV_Items_ItemClick(object sender, ItemClickEventArgs e)
{
// Get instance of the model in the clicked ListViewItem
MyModel myModel = (MyModel)e.ClickedItem;
Image img = myModel.Image;
}
I have something like this:
XAML (for one item):
<ListView Margin="10,0,10,10" Width="360" Height="510" VerticalAlignment="Bottom" RenderTransformOrigin="0.479,0.497">
<ListViewItem RenderTransformOrigin="0.719,0.534">
<StackPanel Orientation="Horizontal">
<Image Source="/Assets/1.png" Margin="0,0,5,0" />
<TextBlock FontSize="20" Width="302" RenderTransformOrigin="0.698,0.49" SelectionChanged="TextBlock_SelectionChanged" IsHoldingEnabled="False" IsDoubleTapEnabled="False">
<Run Text="Stotis–Oro uostas"/>
</TextBlock>
C#:
private void TextBlock_SelectionChanged(object sender, RoutedEventArgs e)
{
this.Frame.Navigate(typeof(SecondPage));
}
I want to make like that: When I click on 1st item it should send me to another page.
You have to add tapped listener to the listview items like this:
<ListView Margin="10,0,10,10" Width="360" Height="510" VerticalAlignment="Bottom" RenderTransformOrigin="0.479,0.497">
<ListViewItem x:Name="ListViewItem1" Tapped="ListViewItem1_Tapped">
<!--add your image and text and ...-->
</ListViewItem>
<ListViewItem x:Name="ListViewItem2" Tapped="ListViewItem2_Tapped">
...
</ListViewItem>
<ListViewItem x:Name="ListViewItem3" Tapped="ListViewItem3_Tapped">
...
</ListViewItem>
</ListView>
Than you can add in the code behind file this:
private void ListViewItem1_Tapped(object sender, TappedRoutedEventArgs e)
{
this.Frame.Navigate(typeof(FirstPage));
}
private void ListViewItem2_Tapped(object sender, TappedRoutedEventArgs e)
{
this.Frame.Navigate(typeof(SecondPage));
}
private void ListViewItem3_Tapped(object sender, TappedRoutedEventArgs e)
{
this.Frame.Navigate(typeof(ThirdPage));
}
I hope this is like you wanted it.