webentwicklung-frage-antwort-db.com.de

Programmgesteuertes Hinzufügen von UISearchBar zu UITableView

Ich versuche, UISearchBar (mit der entsprechenden Suchlogik) hinzuzufügen, aber es gibt ein Problem: Ich verwende die automatisch generierte UITableViewController Unterklasse UITableView anstelle einer separaten nib. Datei, und manipulieren Sie alles programmgesteuert in Bezug auf die Tabellenansicht.

In Interface Builder gibt es die Option, einem nib ein Suchleiste und Suchanzeige-Controller hinzuzufügen. Gibt es eine Möglichkeit, diese Aufgabe programmgesteuert auszuführen, oder ist es zu meinen Gunsten, den Standardwert UITableView aufzugeben und in eine benutzerdefinierte UITableView NIB-Datei zu übertragen, damit ich die UISearchbar problemlos hinzufügen kann?

Außerdem habe ich versucht, anhand des folgenden Codes in meiner UITableView -Implementierung einfach eine Suchleiste zu meinem viewDidLoad -Header hinzuzufügen (wo ich sie haben möchte), aber sie wird hinter dem Tabellenabschnitt angezeigt Header und ist daher unsichtbar, es sei denn, die Tabelle wird nach unten gescrollt, um anzuzeigen, was sonst Leerraum wäre. Was ist damit los?

UISearchBar *testbar = [[UISearchBar alloc] init];

[[self tableView] setTableHeaderView:testbar];
35
Gary Hedren

Stellen Sie den Rahmen für die UISearchBar ein:

// Change the position according to your requirements
self.searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(0, 70, 320, 44)];

Wenn Ihre Ansicht eine Unterklasse von UITableViewController ist, ändern Sie sie in UIViewController.

  • Erstellen Sie in Ihrer NIB-Datei eine Ansicht, ziehen Sie Ihre tableView unter diese Ansicht und ändern Sie die Referenzklasse für diese Ansicht in Ihre UIViewController.

  • Erstellen Sie ein IBOutlet von UITableView * myTableView Und verbinden Sie es mit Ihrer NIB-Datei. Sie müssen nur in Ihrer VC Datei zum Beispiel selbst auf [self.myTableView reloadData]; ändern

Jetzt können Sie die tableView und die Suchleiste in der Schreibfeder selbst anpassen.

UISearchDisplay Controller hat einen eigenen UITableView, der die Ergebnisse einer Suche nach Daten anzeigt, die von einem anderen Ansichtscontroller verwaltet werden. Hier kombiniert searchDisplaycontroller die Suchleiste und die Tabellenansicht, um die Ergebnisdaten in der Tabellenansicht anzuzeigen, sodass keine separate Tabellenansicht erforderlich ist.

21
Praveen-K

Um einer UITableView eine UISearchBar hinzuzufügen, müssen Sie folgende Schritte ausführen:

  • Deklarieren und initialisieren Sie UISearchBar
  • Deklarieren und initialisieren Sie den UISearchDisplayController
  • Fügen Sie der tableView die searchBar hinzu
  • Implementieren Sie den UISearchDisplayController-Delegaten
  • In der Header-Datei deklariere ich meine searchBar, searchDisplayController und die Arrays, die die anzuzeigenden Daten enthalten.

ViewController.h:

#import 

@interface ViewController : UITableViewController
{
    NSArray *originalData;
    NSMutableArray *searchData;

    UISearchBar *searchBar;
    UISearchDisplayController *searchDisplayController;
}

@end

Ich habe der Klasse auch 2 Delegierte hinzugefügt: UISearchBarDelegate und UISearchDisplayDelegate. Ohne funktioniert die searchBar einfach nicht!

Daten initialisieren:

//ViewController.m

- (id)initWithStyle:(UITableViewStyle)style
{
    self = [super initWithStyle:style];
    if (self) {
        NSArray *group1 = [[NSArray alloc] initWithObjects:@"Napoli", @"Juventus", @"Inter", @"Milan", @"Lazio", nil];
        NSArray *group2 = [[NSArray alloc] initWithObjects:@"Real Madrid", @"Barcelona", @"Villareal", @"Valencia", @"Deportivo", nil];
        NSArray *group3 = [[NSArray alloc] initWithObjects:@"Manchester City", @"Manchester United", @"Chelsea", @"Arsenal", @"Liverpool", nil];

        originalData = [[NSArray alloc] initWithObjects:group1, group2, group3, nil];
        searchData = [[NSMutableArray alloc] init];
    }
    return self;
}

Jetzt müssen wir unsere beiden Objekte initialisieren. Ich habe den Code kommentiert, um zu erklären, was ich tue:

//ViewController.m

- (void)viewDidLoad
{
    [super viewDidLoad];

    searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
/*the search bar widht must be > 1, the height must be at least 44
(the real size of the search bar)*/

    searchDisplayController = [[UISearchDisplayController alloc] initWithSearchBar:searchBar contentsController:self];
/*contents controller is the UITableViewController, this let you to reuse
the same TableViewController Delegate method used for the main table.*/

    searchDisplayController.delegate = self;
    searchDisplayController.searchResultsDataSource = self;
//set the delegate = self. Previously declared in ViewController.h

    self.tableView.tableHeaderView = searchBar; //this line add the searchBar
                                                //on the top of tableView.
}

Ich habe beschlossen, den Teil über die Initialisierung der tableView-Zelle zu überspringen. Sie finden ihn im herunterladbaren Quellcode. :)

Wenn die tableView fertig ist, ist es Zeit, das UISearchDisplayControllerDelegate!

Der Delegat hat viele Methoden, um jeden Aspekt der Suche zu steuern, aber die wichtigste ist

- (BOOL)searchDisplayController:(UISearchDisplayController *)controller shouldReloadTableForSearchString:(NSString *)searchString

Diese Methode wird jedes Mal aufgerufen, wenn Sie ein neues Zeichen in die searchBar einfügen. Sie nehmen den searchString, führen die Suche durch die Tabellenelemente durch und geben YES zurück.

- (BOOL)searchDisplayController:(UISearchDisplayController *)controller shouldReloadTableForSearchString:(NSString *)searchString
{
    [searchData removeAllObjects];
    /*before starting the search is necessary to remove all elements from the
      array that will contain found items */

    NSArray *group; 

/* in this loop I search through every element (group) (see the code on top) in
the "originalData" array, if the string match, the element will be added in a
new array called newGroup. Then, if newGroup has 1 or more elements, it will be
added in the "searchData" array. shortly, I recreated the structure of the
original array "originalData". */

    for(group in originalData) //take the n group (eg. group1, group2, group3)
                               //in the original data
    {
        NSMutableArray *newGroup = [[NSMutableArray alloc] init];
        NSString *element;

        for(element in group) //take the n element in the group
        {                    //(eg. @"Napoli, @"Milan" etc.)
            NSRange range = [element rangeOfString:searchString
                                     options:NSCaseInsensitiveSearch];

            if (range.length > 0) { //if the substring match
                [newGroup addObject:element]; //add the element to group
            }
        }

        if ([newGroup count] > 0) {
            [searchData addObject:newGroup];
        }

        [newGroup release];
    }

    return YES;
}

Das ist alles! Diese Methode führt eine Volltextsuche in allen Elementen durch. Wenn die Suche beendet ist, lädt sich die tableView neu. Weitere Details finden Sie im Quellcode.

Quelldatei herunterladen (Link AKTUALISIERT! (04.01.2016)

74
minux

Implementiere - (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section. Dies wird das Problem des Abschnitts Label lösen, der die Header-Ansicht abdeckt

2
Legolas

in Swift:

    let searchController = UISearchController(searchResultsController: nil)

    let topConstraint = NSLayoutConstraint(item: searchController.searchBar, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Top, multiplier: 1, constant: 40)
    let leftConstraint = NSLayoutConstraint(item: searchController.searchBar, attribute: NSLayoutAttribute.Left, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Left, multiplier: 1, constant: 0)
    let rightConstraint = NSLayoutConstraint(item: searchController.searchBar, attribute: NSLayoutAttribute.Right, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Right, multiplier: 1, constant: 0)
    let heightConstraint = NSLayoutConstraint(item: searchController.searchBar, attribute: NSLayoutAttribute.Height, relatedBy: NSLayoutRelation.Equal, toItem: nil, attribute: NSLayoutAttribute.NotAnAttribute, multiplier: 1, constant: 44)
    searchController.searchBar.translatesAutoresizingMaskIntoConstraints = false

    searchController.searchBar.addConstraint(heightConstraint)

    searchController.searchBar.placeholder = "Search Here"
    searchController.searchResultsUpdater = self
    searchController.searchBar.delegate = self

    self.view.addSubview(searchController.searchBar)

    self.view.addConstraints([topConstraint, leftConstraint, rightConstraint])

teilnehmer hinzufügen:

    class ViewController: UIViewController, UISearchBarDelegate

fügen Sie nun die Delegate-Methode hinzu, um die Tabellenansicht neu zu laden:

    func searchBarTextDidBeginEditing(searchBar: UISearchBar) {
        //add your custome code here after search a string
        tableView.reloadData()
    }

    func searchBarTextDidEndEditing(searchBar: UISearchBar) {
        //add your custome code here after finishing search 
        tableView.reloadData()

    }
1
Mr. Tann