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();
}
}