Xamarin.iOS

Add Search Bar to UITableView

Remarks#

Object References:

UITableView table;
TableSource tableSource;
List tableItems;
UISearchBar searchBar;

To fork the complete sample: https://github.com/adiiaditya/Xamarin.iOS-Samples/tree/master/SearchBarWithTableView

Add UISearchBar to UITableView

public override void ViewDidLoad()  
{  
    base.ViewDidLoad();  
    // Perform any additional setup after loading the view, typically from a nib.  

    //Declare the search bar and add it to the header of the table  
    searchBar = new UISearchBar();  
    searchBar.SizeToFit();  
    searchBar.AutocorrectionType = UITextAutocorrectionType.No;  
    searchBar.AutocapitalizationType = UITextAutocapitalizationType.None;  
    searchBar.TextChanged += (sender, e) =>  
    {  
        //this is the method that is called when the user searches  
        searchTable();  
    };  

    Title = "SearchBarWithTableView Sample";  
    table = new UITableView(new CGRect(0, 20, View.Bounds.Width, View.Bounds.Height - 20));  
    //table.AutoresizingMask = UIViewAutoresizing.All;  
    tableItems = new List<TableItem>();  

    tableItems.Add(new TableItem("Vegetables") { ImageName = "Vegetables.jpg" });  
    tableItems.Add(new TableItem("Fruits") { ImageName = "Fruits.jpg" });  
    tableItems.Add(new TableItem("Flower Buds") { ImageName = "Flower Buds.jpg" });  
    tableItems.Add(new TableItem("Legumes") { ImageName = "Legumes.jpg" });  
    tableItems.Add(new TableItem("Tubers") { ImageName = "Tubers.jpg" });  
    tableSource = new TableSource(tableItems);  
    table.Source = tableSource;  
    table.TableHeaderView = searchBar;  
    Add(table);  
}  

private void searchTable()  
{  
    //perform the search, and refresh the table with the results  
    tableSource.PerformSearch(searchBar.Text);  
    table.ReloadData();  
}  

The TableSource class will look like this:

public class TableSource : UITableViewSource  
{  
    private List<TableItem> tableItems = new List<TableItem>();  
    private List<TableItem> searchItems = new List<TableItem>();  
    protected string cellIdentifier = "TableCell";  

    public TableSource(List<TableItem> items)  
    {  
        this.tableItems = items;  
        this.searchItems = items;  
    }  

    public override nint RowsInSection(UITableView tableview, nint section)  
    {  
        return searchItems.Count;  
    }  

    public override UITableViewCell GetCell(UITableView tableView, NSIndexPath indexPath)  
    {  
        // request a recycled cell to save memory  
        UITableViewCell cell = tableView.DequeueReusableCell(cellIdentifier);  


        var cellStyle = UITableViewCellStyle.Default;  

        // if there are no cells to reuse, create a new one  
        if (cell == null)  
        {  
            cell = new UITableViewCell(cellStyle, cellIdentifier);  
        }  

        cell.TextLabel.Text = searchItems[indexPath.Row].Title;  
        cell.ImageView.Image = UIImage.FromFile("Images/" + searchItems[indexPath.Row].ImageName);  

        return cell;  
    }  

    public override nint NumberOfSections(UITableView tableView)  
    {  
        return 1;  
    }  

    public void PerformSearch(string searchText)  
    {  
        searchText = searchText.ToLower();  
        this.searchItems = tableItems.Where(x => x.Title.ToLower().Contains(searchText)).ToList();  
    }  
}  

This modified text is an extract of the original Stack Overflow Documentation created by the contributors and released under CC BY-SA 3.0 This website is not affiliated with Stack Overflow