HTML
<TabView #tabview [selectedIndex]=”tabindex” (selectedIndexChanged)=”indexChanged($event)” sdkExampleTitle sdkToggleNavButton>
<StackLayout *tabItem=”{title: ‘NativeScript’}”>
<SearchBar id=”searchbarid” (loaded)=”sBLoaded($event)” #sb hint=”Search” [text]=”searchPhrase” (clear)=”onClear($event)” (submit)=”onSubmit(sb.text)”></SearchBar>
<Label text=”NativeScript” class=”m-15 h2 text-left” color=”blue”></Label>
<ScrollView>
<Label [text]=”content” textWrap=”true” class=”m-15″></Label>
</ScrollView>
</StackLayout>
<StackLayout *tabItem=”{title: ‘Icon’}”>
<Image class=”m-t-30 m-b-15″ src=”res://icon” width=”80″ height=”80″></Image>
<Label text=”NativeScript” textWrap=”true” class=”h2 m-x-auto” color=”blue”></Label>
</StackLayout>
</TabView>
TypeScript
import { Component } from “@angular/core”;
import {SearchBar} from “ui/search-bar”;
import {isAndroid} from “platform”;
import {Page} from “ui/page”
@Component({
selector: “ns-app”,
templateUrl: “app.component.html”,
})
export class AppComponent {
public searchPhrase: string;
constructor(private page:Page){}
public onSubmit(value) {
var searchbar:SearchBar = this.page.getViewById(“searchbarid”);
searchbar.dismissSoftInput();
console.log(“You are searching for ” + value);
}
public sBLoaded(args){
var searchbar:SearchBar = args.object;
if(isAndroid){
searchbar.android.clearFocus();
}
}
public onClear(args){
var searchbar:SearchBar = args.object;
searchbar.dismissSoftInput();
}
public indexChanged(args){
var searchbar:SearchBar = this.page.getViewById(“searchbarid”);
searchbar.dismissSoftInput();
}
}
We are glad that you preferred to contact us. Please fill our short form and one of our friendly team members will contact you back.