Question

i have a windows phone silverlight grid that is quite big, around 4 x 22 elements (4 columns, 22 rows) and im trying to implement a search box that dynamically changes properties of those elements and their position in the grid.

each element is a StackPanel (with an Image followed by a TextBlock).

so this page xaml is something like:

<stackpanel>
    <textbox />
    <scrollviewer>
       <grid 22x4 />
    </scrollviewer>
</stackpanel>

ive done it like this so i can scroll that grid without making the top textbox scroll too.

what i want now is to implement the textchange event on the textbox so it filters those elements. for instance there are 3 elements whose name begin with the letter ‘z’, so what i want when i type ‘z’ into the textbox is that all elements whose name dont start with ‘z’ to change their visibility to “collapse” and move all the ones that start with ‘z’ to the firsts row and columns.

but how can i access those elements in code? if i have the grid object, what method returns the list of elements if there is any so i can manipulate them?

also, is this the best way to do it? the way i see it it might be a bit overhead for a mobile application, any tips are welcome.

thanks.

Answer 1

I don’t exactly understand how do you want to filter and what kind your grid elements are. But my example shows the way to filter all grid elements, change Grid.Row, Grid.Column, Visibility properties.

private void Filter(Grid grid, string text)
{
  var cur = 0;
  var columnCount = grid.ColumnDefinitions.Count;

  foreach (var child in grid.Children)
  {
    var name = child.GetValue(NameProperty) == null ? child.GetValue(NameProperty).ToString() : "";
    if (name.StartsWith(text))
    {
      child.Visibility = Visibility.Visible;          
      child.SetValue(Grid.RowProperty, cur / columnCount);
      child.SetValue(Grid.ColumnProperty, cur % columnCount);
      cur++;
    }
    else        
      child.Visibility = Visibility.Collapsed;                  
  }
}