mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-16 11:42:04 +08:00
example declare SearchBar component via XML (#4236)
* example declare SearchBar component via XML * fix tslint errors * fix error - not found modules
This commit is contained in:
17
tests/app/ui/search-bar/search-bar-code-snippet.ts
Normal file
17
tests/app/ui/search-bar/search-bar-code-snippet.ts
Normal file
@ -0,0 +1,17 @@
|
||||
import { EventData } from 'tns-core-modules/data/observable';
|
||||
import { SearchBar } from "tns-core-modules/ui/search-bar"
|
||||
|
||||
export function navigatingTo(args: EventData) {
|
||||
console.log("page navigating to");
|
||||
}
|
||||
// >> searchbar-clear
|
||||
export function onClear(args){
|
||||
console.log("clear search-bar text");
|
||||
}
|
||||
// << searchbar-clear
|
||||
// >> searchbar-submit
|
||||
export function onSubmit(args){
|
||||
var searchbar:SearchBar = <SearchBar>args.object;
|
||||
console.log("Search submit result: "+searchbar.text);
|
||||
}
|
||||
// << searchbar-submit
|
@ -5,6 +5,18 @@ environment: nativescript
|
||||
description: "Examples for using search-bar"
|
||||
previous_url: /ApiReference/ui/search-bar/HOW-TO
|
||||
---
|
||||
# Declare SearchBar via XML
|
||||
```XML
|
||||
<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo" class="page">
|
||||
<StackLayout class="p-20">
|
||||
<SearchBar id="searchBar" hint="Search" text="" clear="onClear" submit="onSubmit" />
|
||||
</StackLayout>
|
||||
</Page>
|
||||
```
|
||||
## SearchBar submit event
|
||||
{%snippet searchbar-submit%}
|
||||
## SearchBar clear event
|
||||
{%snippet searchbar-clear%}
|
||||
# SearchBar
|
||||
Using the SearchBar requires the "ui/search-bar" module.
|
||||
{%snippet article-require-searchbar-module%}
|
||||
|
Reference in New Issue
Block a user