Search code examples
c#gridviewwindows-store-appswin-universal-appwinrt-xaml

GridView LostFocus and GotFocus events


The GridView GotFocus and LostFocus seem to fire each time focus is shifted from one GridViewItem to another. Is there any way to know when a GridView as a whole received and lost focus?

MyGridView.GotFocus += MyGridView_GotFocus;
MyGridView.LostFocus += MyGridView_LostFocus;

The above events MyGridView_GotFocus & MyGridView_LostFocus fires each time focus is moved from one GridViewItem to another in MyGridView


Solution

  • Is there any way to know when a GridView as a whole received and lost focus?

    There is no direct way to do that. We can only use a workaround to imitate that behavior. The basic thought is that since the GotFocus and LostFocus are both Routed Events, we can imitate the GridView's GotFocus and LostFocus in page root Grid's GotFocus and LostFocus Events.

    Here is the XAML:

    <Grid Name="rootGrid" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <StackPanel Margin="100,50">
            <StackPanel VerticalAlignment="Center" >
                <GridView Name="myGridView"></GridView>
        </StackPanel>
            <TextBlock Name="myTb"></TextBlock>
            <GridView Name="myGridView2" ></GridView>
        <TextBlock Name="output">This is the OutPut Text: </TextBlock>
            <Button Name="btnFocus" >Focus Button</Button>
        </StackPanel>
    </Grid>
    

    And here is the Codes:

    public sealed partial class MainPage : Page
    {
        public List<String> List;
        public List<String> List2;
        private object PreviousFocusItem;
        public MainPage()
        {
            this.InitializeComponent();
        }
    
        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            List = new List<string> { "data1_GridView1", "data2_GridView1", "data3_GridView1" };
            List2 = new List<string> { "data1_GridView2", "data2_GridView2", "data3_GridView2" };
            myGridView.ItemsSource = List;
            myGridView2.ItemsSource = List2;
            rootGrid.GotFocus += Grid_GotFocus;
            rootGrid.LostFocus += Grid_LostFocus;
            base.OnNavigatedTo(e);
        }
    
        private void Grid_LostFocus(object sender, RoutedEventArgs e)
        {
            PreviousFocusItem = e.OriginalSource;
        }
    
        private void Grid_GotFocus(object sender, RoutedEventArgs e)
        {
            //get the previous focus Element and current focus Element.
            var previous = PreviousFocusItem as UIElement;
            var current = e.OriginalSource as UIElement;
    
            //got focus logic
            if ((!IsElementInsideGridView(myGridView, previous)) &&IsElementInsideGridView(myGridView,current))
            {
                //gridView got focus as a whole, put your codes here:
                output.Text += "Got Focus+1 \n";
            }
    
            //lost focus logic
            if ((!IsElementInsideGridView(myGridView, current)) &&(IsElementInsideGridView(myGridView,previous)) )
            {
                //gridView lost focus as a whole, put your codes here:
                output.Text += "Lost Focus+1 \n";
            }
        }
    
        private bool IsElementInsideGridView(GridView gridView,UIElement element)
        {
            Point topLeft = gridView.TransformToVisual(this).TransformPoint(new Point());
            Rect rectBounds = new Rect(topLeft.X, topLeft.Y, gridView.ActualWidth, gridView.ActualHeight);
            IEnumerable<UIElement> hits = VisualTreeHelper.FindElementsInHostCoordinates(rectBounds, element);
            if (hits == null || hits.Count() == 0)
            {
                return false;
            }
            else
            {
                return true;
            }
        }
    }
    

    As you can see every time the root Grid got focus. If the PreviousFocusItem lies not in the TargetGridView, and CurrentFocusItem lies in the TargetGridView. It means TargetGridView got focus as a whole. For LostFocus the logic is similar.

    Here is my complete project:GridViewFocusSample.