mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-11-05 13:26:48 +08:00
chore: format
This commit is contained in:
Nathan Walker
@@ -1,12 +1,24 @@
|
||||
import { Font } from "../styling/font";
|
||||
import {
|
||||
SearchBarBase,
|
||||
textProperty, hintProperty, textFieldHintColorProperty, textFieldBackgroundColorProperty,
|
||||
SearchBarBase,
|
||||
textProperty,
|
||||
hintProperty,
|
||||
textFieldHintColorProperty,
|
||||
textFieldBackgroundColorProperty,
|
||||
} from "./search-bar-common";
|
||||
import { isUserInteractionEnabledProperty, isEnabledProperty } from "../core/view";
|
||||
import {
|
||||
isUserInteractionEnabledProperty,
|
||||
isEnabledProperty,
|
||||
} from "../core/view";
|
||||
import { ad } from "../../utils/utils";
|
||||
import { Color } from "../../color";
|
||||
import { colorProperty, backgroundColorProperty, backgroundInternalProperty, fontInternalProperty, fontSizeProperty } from "../styling/style-properties";
|
||||
import {
|
||||
colorProperty,
|
||||
backgroundColorProperty,
|
||||
backgroundInternalProperty,
|
||||
fontInternalProperty,
|
||||
fontSizeProperty,
|
||||
} from "../styling/style-properties";
|
||||
|
||||
export * from "./search-bar-common";
|
||||
|
||||
@@ -14,271 +26,299 @@ const SEARCHTEXT = Symbol("searchText");
|
||||
const QUERY = Symbol("query");
|
||||
|
||||
interface QueryTextListener {
|
||||
new(owner: SearchBar): androidx.appcompat.widget.SearchView.OnQueryTextListener;
|
||||
new (
|
||||
owner: SearchBar
|
||||
): androidx.appcompat.widget.SearchView.OnQueryTextListener;
|
||||
}
|
||||
|
||||
interface CloseListener {
|
||||
new(owner: SearchBar): androidx.appcompat.widget.SearchView.OnCloseListener;
|
||||
new (
|
||||
owner: SearchBar
|
||||
): androidx.appcompat.widget.SearchView.OnCloseListener;
|
||||
}
|
||||
|
||||
let QueryTextListener: QueryTextListener;
|
||||
let CloseListener: CloseListener;
|
||||
|
||||
function initializeNativeClasses(): void {
|
||||
if (QueryTextListener) {
|
||||
return;
|
||||
}
|
||||
if (QueryTextListener) {
|
||||
return;
|
||||
}
|
||||
|
||||
@Interfaces([androidx.appcompat.widget.SearchView.OnQueryTextListener])
|
||||
class CompatQueryTextListenerImpl extends java.lang.Object implements androidx.appcompat.widget.SearchView.OnQueryTextListener {
|
||||
constructor(private owner: SearchBar) {
|
||||
super();
|
||||
@Interfaces([androidx.appcompat.widget.SearchView.OnQueryTextListener])
|
||||
class CompatQueryTextListenerImpl extends java.lang.Object
|
||||
implements androidx.appcompat.widget.SearchView.OnQueryTextListener {
|
||||
constructor(private owner: SearchBar) {
|
||||
super();
|
||||
|
||||
return global.__native(this);
|
||||
}
|
||||
return global.__native(this);
|
||||
}
|
||||
|
||||
onQueryTextChange(newText: string): boolean {
|
||||
const owner = this.owner;
|
||||
textProperty.nativeValueChange(owner, newText);
|
||||
onQueryTextChange(newText: string): boolean {
|
||||
const owner = this.owner;
|
||||
textProperty.nativeValueChange(owner, newText);
|
||||
|
||||
// This code is needed since sometimes OnCloseListener is not called!
|
||||
if (newText === "" && this[SEARCHTEXT] !== newText) {
|
||||
owner._emit(SearchBarBase.clearEvent);
|
||||
}
|
||||
// This code is needed since sometimes OnCloseListener is not called!
|
||||
if (newText === "" && this[SEARCHTEXT] !== newText) {
|
||||
owner._emit(SearchBarBase.clearEvent);
|
||||
}
|
||||
|
||||
this[SEARCHTEXT] = newText;
|
||||
this[QUERY] = undefined;
|
||||
this[SEARCHTEXT] = newText;
|
||||
this[QUERY] = undefined;
|
||||
|
||||
return true;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
onQueryTextSubmit(query: string): boolean {
|
||||
const owner = this.owner;
|
||||
// This code is needed since onQueryTextSubmit is called twice with same query!
|
||||
if (query !== "" && this[QUERY] !== query) {
|
||||
owner._emit(SearchBarBase.submitEvent);
|
||||
}
|
||||
onQueryTextSubmit(query: string): boolean {
|
||||
const owner = this.owner;
|
||||
// This code is needed since onQueryTextSubmit is called twice with same query!
|
||||
if (query !== "" && this[QUERY] !== query) {
|
||||
owner._emit(SearchBarBase.submitEvent);
|
||||
}
|
||||
|
||||
this[QUERY] = query;
|
||||
this[QUERY] = query;
|
||||
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
@Interfaces([androidx.appcompat.widget.SearchView.OnCloseListener])
|
||||
class CompatCloseListenerImpl extends java.lang.Object implements androidx.appcompat.widget.SearchView.OnCloseListener {
|
||||
constructor(private owner: SearchBar) {
|
||||
super();
|
||||
@Interfaces([androidx.appcompat.widget.SearchView.OnCloseListener])
|
||||
class CompatCloseListenerImpl extends java.lang.Object
|
||||
implements androidx.appcompat.widget.SearchView.OnCloseListener {
|
||||
constructor(private owner: SearchBar) {
|
||||
super();
|
||||
|
||||
return global.__native(this);
|
||||
}
|
||||
return global.__native(this);
|
||||
}
|
||||
|
||||
onClose(): boolean {
|
||||
this.owner._emit(SearchBarBase.clearEvent);
|
||||
onClose(): boolean {
|
||||
this.owner._emit(SearchBarBase.clearEvent);
|
||||
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
QueryTextListener = CompatQueryTextListenerImpl;
|
||||
CloseListener = CompatCloseListenerImpl;
|
||||
QueryTextListener = CompatQueryTextListenerImpl;
|
||||
CloseListener = CompatCloseListenerImpl;
|
||||
}
|
||||
|
||||
function enableSearchView(nativeView: any, value: boolean) {
|
||||
nativeView.setEnabled(value);
|
||||
nativeView.setEnabled(value);
|
||||
|
||||
if (!(nativeView instanceof android.view.ViewGroup)) {
|
||||
return;
|
||||
}
|
||||
if (!(nativeView instanceof android.view.ViewGroup)) {
|
||||
return;
|
||||
}
|
||||
|
||||
for (let i = 0; i < nativeView.getChildCount(); i++) {
|
||||
let child = nativeView.getChildAt(i);
|
||||
enableSearchView(child, value);
|
||||
}
|
||||
for (let i = 0; i < nativeView.getChildCount(); i++) {
|
||||
let child = nativeView.getChildAt(i);
|
||||
enableSearchView(child, value);
|
||||
}
|
||||
}
|
||||
|
||||
function enableUserInteractionSearchView(nativeView: any, value: boolean) {
|
||||
nativeView.setClickable(value);
|
||||
nativeView.setFocusable(value);
|
||||
nativeView.setClickable(value);
|
||||
nativeView.setFocusable(value);
|
||||
|
||||
if (!(nativeView instanceof android.view.ViewGroup)) {
|
||||
return;
|
||||
}
|
||||
if (!(nativeView instanceof android.view.ViewGroup)) {
|
||||
return;
|
||||
}
|
||||
|
||||
for (let i = 0; i < nativeView.getChildCount(); i++) {
|
||||
let child = nativeView.getChildAt(i);
|
||||
enableUserInteractionSearchView(child, value);
|
||||
}
|
||||
for (let i = 0; i < nativeView.getChildCount(); i++) {
|
||||
let child = nativeView.getChildAt(i);
|
||||
enableUserInteractionSearchView(child, value);
|
||||
}
|
||||
}
|
||||
|
||||
export class SearchBar extends SearchBarBase {
|
||||
nativeViewProtected: androidx.appcompat.widget.SearchView;
|
||||
private _searchTextView: android.widget.TextView;
|
||||
private _searchPlate: android.widget.LinearLayout;
|
||||
nativeViewProtected: androidx.appcompat.widget.SearchView;
|
||||
private _searchTextView: android.widget.TextView;
|
||||
private _searchPlate: android.widget.LinearLayout;
|
||||
|
||||
public dismissSoftInput() {
|
||||
ad.dismissSoftInput(this.nativeViewProtected);
|
||||
}
|
||||
public dismissSoftInput() {
|
||||
ad.dismissSoftInput(this.nativeViewProtected);
|
||||
}
|
||||
|
||||
public focus(): boolean {
|
||||
let result = super.focus();
|
||||
if (result) {
|
||||
ad.showSoftInput(this.nativeViewProtected);
|
||||
}
|
||||
public focus(): boolean {
|
||||
let result = super.focus();
|
||||
if (result) {
|
||||
ad.showSoftInput(this.nativeViewProtected);
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
public createNativeView() {
|
||||
const nativeView = new androidx.appcompat.widget.SearchView(this._context);
|
||||
nativeView.setIconified(false);
|
||||
public createNativeView() {
|
||||
const nativeView = new androidx.appcompat.widget.SearchView(
|
||||
this._context
|
||||
);
|
||||
nativeView.setIconified(false);
|
||||
|
||||
return nativeView;
|
||||
}
|
||||
return nativeView;
|
||||
}
|
||||
|
||||
public initNativeView(): void {
|
||||
super.initNativeView();
|
||||
const nativeView = this.nativeViewProtected;
|
||||
initializeNativeClasses();
|
||||
const queryTextListener = new QueryTextListener(this);
|
||||
nativeView.setOnQueryTextListener(queryTextListener);
|
||||
(<any>nativeView).queryTextListener = queryTextListener;
|
||||
public initNativeView(): void {
|
||||
super.initNativeView();
|
||||
const nativeView = this.nativeViewProtected;
|
||||
initializeNativeClasses();
|
||||
const queryTextListener = new QueryTextListener(this);
|
||||
nativeView.setOnQueryTextListener(queryTextListener);
|
||||
(<any>nativeView).queryTextListener = queryTextListener;
|
||||
|
||||
const closeListener = new CloseListener(this);
|
||||
nativeView.setOnCloseListener(closeListener);
|
||||
(<any>nativeView).closeListener = closeListener;
|
||||
}
|
||||
const closeListener = new CloseListener(this);
|
||||
nativeView.setOnCloseListener(closeListener);
|
||||
(<any>nativeView).closeListener = closeListener;
|
||||
}
|
||||
|
||||
public disposeNativeView() {
|
||||
const nativeView: any = this.nativeViewProtected;
|
||||
nativeView.closeListener.owner = null;
|
||||
nativeView.queryTextListener.owner = null;
|
||||
this._searchPlate = null;
|
||||
this._searchTextView = null;
|
||||
super.disposeNativeView();
|
||||
}
|
||||
public disposeNativeView() {
|
||||
const nativeView: any = this.nativeViewProtected;
|
||||
nativeView.closeListener.owner = null;
|
||||
nativeView.queryTextListener.owner = null;
|
||||
this._searchPlate = null;
|
||||
this._searchTextView = null;
|
||||
super.disposeNativeView();
|
||||
}
|
||||
|
||||
[isEnabledProperty.setNative](value: boolean) {
|
||||
enableSearchView(this.nativeViewProtected, value);
|
||||
}
|
||||
[isEnabledProperty.setNative](value: boolean) {
|
||||
enableSearchView(this.nativeViewProtected, value);
|
||||
}
|
||||
|
||||
[isUserInteractionEnabledProperty.setNative](value: boolean) {
|
||||
enableUserInteractionSearchView(this.nativeViewProtected, value);
|
||||
}
|
||||
[isUserInteractionEnabledProperty.setNative](value: boolean) {
|
||||
enableUserInteractionSearchView(this.nativeViewProtected, value);
|
||||
}
|
||||
|
||||
[backgroundColorProperty.getDefault](): number {
|
||||
// TODO: Why do we get DrawingCacheBackgroundColor but set backgroundColor?????
|
||||
const result = this.nativeViewProtected.getDrawingCacheBackgroundColor();
|
||||
[backgroundColorProperty.getDefault](): number {
|
||||
// TODO: Why do we get DrawingCacheBackgroundColor but set backgroundColor?????
|
||||
const result = this.nativeViewProtected.getDrawingCacheBackgroundColor();
|
||||
|
||||
return result;
|
||||
}
|
||||
[backgroundColorProperty.setNative](value: Color) {
|
||||
let color: number;
|
||||
if (typeof value === "number") {
|
||||
color = value;
|
||||
} else {
|
||||
color = value.android;
|
||||
}
|
||||
return result;
|
||||
}
|
||||
[backgroundColorProperty.setNative](value: Color) {
|
||||
let color: number;
|
||||
if (typeof value === "number") {
|
||||
color = value;
|
||||
} else {
|
||||
color = value.android;
|
||||
}
|
||||
|
||||
this.nativeViewProtected.setBackgroundColor(color);
|
||||
const searchPlate = this._getSearchPlate();
|
||||
searchPlate.setBackgroundColor(color);
|
||||
}
|
||||
this.nativeViewProtected.setBackgroundColor(color);
|
||||
const searchPlate = this._getSearchPlate();
|
||||
searchPlate.setBackgroundColor(color);
|
||||
}
|
||||
|
||||
[colorProperty.getDefault](): number {
|
||||
const textView = this._getTextView();
|
||||
[colorProperty.getDefault](): number {
|
||||
const textView = this._getTextView();
|
||||
|
||||
return textView.getCurrentTextColor();
|
||||
}
|
||||
[colorProperty.setNative](value: Color) {
|
||||
const color: number = (typeof value === "number") ? value : value.android;
|
||||
const textView = this._getTextView();
|
||||
textView.setTextColor(color);
|
||||
}
|
||||
return textView.getCurrentTextColor();
|
||||
}
|
||||
[colorProperty.setNative](value: Color) {
|
||||
const color: number = typeof value === "number" ? value : value.android;
|
||||
const textView = this._getTextView();
|
||||
textView.setTextColor(color);
|
||||
}
|
||||
|
||||
[fontSizeProperty.getDefault](): { nativeSize: number } {
|
||||
return { nativeSize: this._getTextView().getTextSize() };
|
||||
}
|
||||
[fontSizeProperty.setNative](value: number | { nativeSize: number }) {
|
||||
if (typeof value === "number") {
|
||||
this._getTextView().setTextSize(value);
|
||||
} else {
|
||||
this._getTextView().setTextSize(android.util.TypedValue.COMPLEX_UNIT_PX, value.nativeSize);
|
||||
}
|
||||
}
|
||||
[fontSizeProperty.getDefault](): { nativeSize: number } {
|
||||
return { nativeSize: this._getTextView().getTextSize() };
|
||||
}
|
||||
[fontSizeProperty.setNative](value: number | { nativeSize: number }) {
|
||||
if (typeof value === "number") {
|
||||
this._getTextView().setTextSize(value);
|
||||
} else {
|
||||
this._getTextView().setTextSize(
|
||||
android.util.TypedValue.COMPLEX_UNIT_PX,
|
||||
value.nativeSize
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
[fontInternalProperty.getDefault](): android.graphics.Typeface {
|
||||
return this._getTextView().getTypeface();
|
||||
}
|
||||
[fontInternalProperty.setNative](value: Font | android.graphics.Typeface) {
|
||||
this._getTextView().setTypeface(value instanceof Font ? value.getAndroidTypeface() : value);
|
||||
}
|
||||
[fontInternalProperty.getDefault](): android.graphics.Typeface {
|
||||
return this._getTextView().getTypeface();
|
||||
}
|
||||
[fontInternalProperty.setNative](value: Font | android.graphics.Typeface) {
|
||||
this._getTextView().setTypeface(
|
||||
value instanceof Font ? value.getAndroidTypeface() : value
|
||||
);
|
||||
}
|
||||
|
||||
[backgroundInternalProperty.getDefault](): any {
|
||||
return null;
|
||||
}
|
||||
[backgroundInternalProperty.setNative](value: any) {
|
||||
//
|
||||
}
|
||||
[backgroundInternalProperty.getDefault](): any {
|
||||
return null;
|
||||
}
|
||||
[backgroundInternalProperty.setNative](value: any) {
|
||||
//
|
||||
}
|
||||
|
||||
[textProperty.getDefault](): string {
|
||||
return "";
|
||||
}
|
||||
[textProperty.setNative](value: string) {
|
||||
const text = (value === null || value === undefined) ? "" : value.toString();
|
||||
this.nativeViewProtected.setQuery(text, false);
|
||||
}
|
||||
[hintProperty.getDefault](): string {
|
||||
return null;
|
||||
}
|
||||
[hintProperty.setNative](value: string) {
|
||||
if (value === null || value === undefined) {
|
||||
this.nativeViewProtected.setQueryHint(null);
|
||||
} else {
|
||||
this.nativeViewProtected.setQueryHint(value.toString());
|
||||
}
|
||||
}
|
||||
[textFieldBackgroundColorProperty.getDefault](): android.graphics.drawable.Drawable {
|
||||
const textView = this._getTextView();
|
||||
[textProperty.getDefault](): string {
|
||||
return "";
|
||||
}
|
||||
[textProperty.setNative](value: string) {
|
||||
const text =
|
||||
value === null || value === undefined ? "" : value.toString();
|
||||
this.nativeViewProtected.setQuery(text, false);
|
||||
}
|
||||
[hintProperty.getDefault](): string {
|
||||
return null;
|
||||
}
|
||||
[hintProperty.setNative](value: string) {
|
||||
if (value === null || value === undefined) {
|
||||
this.nativeViewProtected.setQueryHint(null);
|
||||
} else {
|
||||
this.nativeViewProtected.setQueryHint(value.toString());
|
||||
}
|
||||
}
|
||||
[textFieldBackgroundColorProperty.getDefault](): android.graphics.drawable.Drawable {
|
||||
const textView = this._getTextView();
|
||||
|
||||
return textView.getBackground();
|
||||
}
|
||||
[textFieldBackgroundColorProperty.setNative](value: Color) {
|
||||
const textView = this._getTextView();
|
||||
if (value instanceof Color) {
|
||||
textView.setBackgroundColor(value.android);
|
||||
} else {
|
||||
textView.setBackground(value);
|
||||
}
|
||||
}
|
||||
[textFieldHintColorProperty.getDefault](): number {
|
||||
const textView = this._getTextView();
|
||||
return textView.getBackground();
|
||||
}
|
||||
[textFieldBackgroundColorProperty.setNative](value: Color) {
|
||||
const textView = this._getTextView();
|
||||
if (value instanceof Color) {
|
||||
textView.setBackgroundColor(value.android);
|
||||
} else {
|
||||
textView.setBackground(value);
|
||||
}
|
||||
}
|
||||
[textFieldHintColorProperty.getDefault](): number {
|
||||
const textView = this._getTextView();
|
||||
|
||||
return textView.getCurrentTextColor();
|
||||
}
|
||||
[textFieldHintColorProperty.setNative](value: Color) {
|
||||
const textView = this._getTextView();
|
||||
const color = value instanceof Color ? value.android : value;
|
||||
textView.setHintTextColor(color);
|
||||
}
|
||||
return textView.getCurrentTextColor();
|
||||
}
|
||||
[textFieldHintColorProperty.setNative](value: Color) {
|
||||
const textView = this._getTextView();
|
||||
const color = value instanceof Color ? value.android : value;
|
||||
textView.setHintTextColor(color);
|
||||
}
|
||||
|
||||
private _getTextView(): android.widget.TextView {
|
||||
if (!this._searchTextView) {
|
||||
const pkgName = this.nativeViewProtected.getContext().getPackageName();
|
||||
const id = this.nativeViewProtected.getContext().getResources().getIdentifier("search_src_text", "id", pkgName);
|
||||
this._searchTextView = <android.widget.TextView>this.nativeViewProtected.findViewById(id);
|
||||
}
|
||||
private _getTextView(): android.widget.TextView {
|
||||
if (!this._searchTextView) {
|
||||
const pkgName = this.nativeViewProtected
|
||||
.getContext()
|
||||
.getPackageName();
|
||||
const id = this.nativeViewProtected
|
||||
.getContext()
|
||||
.getResources()
|
||||
.getIdentifier("search_src_text", "id", pkgName);
|
||||
this._searchTextView = <android.widget.TextView>(
|
||||
this.nativeViewProtected.findViewById(id)
|
||||
);
|
||||
}
|
||||
|
||||
return this._searchTextView;
|
||||
}
|
||||
return this._searchTextView;
|
||||
}
|
||||
|
||||
private _getSearchPlate(): android.widget.LinearLayout {
|
||||
if (!this._searchPlate) {
|
||||
const pkgName = this.nativeViewProtected.getContext().getPackageName();
|
||||
const id = this.nativeViewProtected.getContext().getResources().getIdentifier("search_plate", "id", pkgName);
|
||||
this._searchPlate = <android.widget.LinearLayout>this.nativeViewProtected.findViewById(id);
|
||||
}
|
||||
private _getSearchPlate(): android.widget.LinearLayout {
|
||||
if (!this._searchPlate) {
|
||||
const pkgName = this.nativeViewProtected
|
||||
.getContext()
|
||||
.getPackageName();
|
||||
const id = this.nativeViewProtected
|
||||
.getContext()
|
||||
.getResources()
|
||||
.getIdentifier("search_plate", "id", pkgName);
|
||||
this._searchPlate = <android.widget.LinearLayout>(
|
||||
this.nativeViewProtected.findViewById(id)
|
||||
);
|
||||
}
|
||||
|
||||
return this._searchPlate;
|
||||
}
|
||||
return this._searchPlate;
|
||||
}
|
||||
}
|
||||
|
||||
102
nativescript-core/ui/search-bar/index.d.ts
vendored
102
nativescript-core/ui/search-bar/index.d.ts
vendored
@@ -7,68 +7,68 @@ import { Color } from "../../color";
|
||||
* Represents a search bar component.
|
||||
*/
|
||||
export class SearchBar extends View {
|
||||
/**
|
||||
* String value used when hooking to submit event.
|
||||
*/
|
||||
public static submitEvent: string;
|
||||
/**
|
||||
* String value used when hooking to submit event.
|
||||
*/
|
||||
public static submitEvent: string;
|
||||
|
||||
/**
|
||||
* String value used when hooking to clear event.
|
||||
*/
|
||||
public static clearEvent: string;
|
||||
/**
|
||||
* String value used when hooking to clear event.
|
||||
*/
|
||||
public static clearEvent: string;
|
||||
|
||||
/**
|
||||
* Gets the native [android widget](http://developer.android.com/reference/android/widget/SearchView.html) that represents the user interface for this component. Valid only when running on Android OS.
|
||||
*/
|
||||
android: any /* android.widget.SearchView */;
|
||||
/**
|
||||
* Gets the native [android widget](http://developer.android.com/reference/android/widget/SearchView.html) that represents the user interface for this component. Valid only when running on Android OS.
|
||||
*/
|
||||
android: any /* android.widget.SearchView */;
|
||||
|
||||
/**
|
||||
* Gets the native iOS [UISearchBar](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UISearchBar_Class/) that represents the user interface for this component. Valid only when running on iOS.
|
||||
*/
|
||||
ios: any /* UISearchBar */;
|
||||
/**
|
||||
* Gets the native iOS [UISearchBar](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UISearchBar_Class/) that represents the user interface for this component. Valid only when running on iOS.
|
||||
*/
|
||||
ios: any /* UISearchBar */;
|
||||
|
||||
/**
|
||||
* Gets or sets a search bar text.
|
||||
*/
|
||||
text: string;
|
||||
/**
|
||||
* Gets or sets a search bar text.
|
||||
*/
|
||||
text: string;
|
||||
|
||||
/**
|
||||
* Gets or sets the text of the search bar text field hint/placeholder.
|
||||
*/
|
||||
hint: string;
|
||||
/**
|
||||
* Gets or sets the text of the search bar text field hint/placeholder.
|
||||
*/
|
||||
hint: string;
|
||||
|
||||
/**
|
||||
* Gets or sets the TextField background color of the SearchBar component.
|
||||
*/
|
||||
textFieldBackgroundColor: Color;
|
||||
/**
|
||||
* Gets or sets the TextField background color of the SearchBar component.
|
||||
*/
|
||||
textFieldBackgroundColor: Color;
|
||||
|
||||
/**
|
||||
* Gets or sets the TextField Hint color of the SearchBar component.
|
||||
*/
|
||||
textFieldHintColor: Color;
|
||||
/**
|
||||
* Gets or sets the TextField Hint color of the SearchBar component.
|
||||
*/
|
||||
textFieldHintColor: Color;
|
||||
|
||||
/**
|
||||
* A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
|
||||
* @param eventNames - String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").
|
||||
* @param callback - Callback function which will be executed when event is raised.
|
||||
* @param thisArg - An optional parameter which will be used as `this` context for callback execution.
|
||||
*/
|
||||
on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
|
||||
/**
|
||||
* A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
|
||||
* @param eventNames - String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").
|
||||
* @param callback - Callback function which will be executed when event is raised.
|
||||
* @param thisArg - An optional parameter which will be used as `this` context for callback execution.
|
||||
*/
|
||||
on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
|
||||
|
||||
/**
|
||||
* Raised when a search bar search is submitted.
|
||||
*/
|
||||
on(event: "submit", callback: (args: EventData) => void, thisArg?: any);
|
||||
/**
|
||||
* Raised when a search bar search is submitted.
|
||||
*/
|
||||
on(event: "submit", callback: (args: EventData) => void, thisArg?: any);
|
||||
|
||||
/**
|
||||
* Raised when a search bar search is closed.
|
||||
*/
|
||||
on(event: "close", callback: (args: EventData) => void, thisArg?: any);
|
||||
/**
|
||||
* Raised when a search bar search is closed.
|
||||
*/
|
||||
on(event: "close", callback: (args: EventData) => void, thisArg?: any);
|
||||
|
||||
/**
|
||||
* Hides the soft input method, usually a soft keyboard.
|
||||
*/
|
||||
dismissSoftInput(): void;
|
||||
/**
|
||||
* Hides the soft input method, usually a soft keyboard.
|
||||
*/
|
||||
dismissSoftInput(): void;
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -1,11 +1,19 @@
|
||||
import { Font } from "../styling/font";
|
||||
import {
|
||||
SearchBarBase,
|
||||
textProperty, hintProperty, textFieldHintColorProperty, textFieldBackgroundColorProperty
|
||||
SearchBarBase,
|
||||
textProperty,
|
||||
hintProperty,
|
||||
textFieldHintColorProperty,
|
||||
textFieldBackgroundColorProperty,
|
||||
} from "./search-bar-common";
|
||||
import { isEnabledProperty } from "../core/view";
|
||||
import { Color } from "../../color";
|
||||
import { colorProperty, backgroundColorProperty, backgroundInternalProperty, fontInternalProperty } from "../styling/style-properties";
|
||||
import {
|
||||
colorProperty,
|
||||
backgroundColorProperty,
|
||||
backgroundInternalProperty,
|
||||
fontInternalProperty,
|
||||
} from "../styling/style-properties";
|
||||
import { ios as iosUtils } from "../../utils/utils";
|
||||
|
||||
export * from "./search-bar-common";
|
||||
@@ -13,221 +21,231 @@ export * from "./search-bar-common";
|
||||
const majorVersion = iosUtils.MajorVersion;
|
||||
|
||||
class UISearchBarDelegateImpl extends NSObject implements UISearchBarDelegate {
|
||||
public static ObjCProtocols = [UISearchBarDelegate];
|
||||
public static ObjCProtocols = [UISearchBarDelegate];
|
||||
|
||||
private _owner: WeakRef<SearchBar>;
|
||||
private _owner: WeakRef<SearchBar>;
|
||||
|
||||
public static initWithOwner(owner: WeakRef<SearchBar>): UISearchBarDelegateImpl {
|
||||
let delegate = <UISearchBarDelegateImpl>UISearchBarDelegateImpl.new();
|
||||
delegate._owner = owner;
|
||||
public static initWithOwner(
|
||||
owner: WeakRef<SearchBar>
|
||||
): UISearchBarDelegateImpl {
|
||||
let delegate = <UISearchBarDelegateImpl>UISearchBarDelegateImpl.new();
|
||||
delegate._owner = owner;
|
||||
|
||||
return delegate;
|
||||
}
|
||||
return delegate;
|
||||
}
|
||||
|
||||
public searchBarTextDidChange(searchBar: UISearchBar, searchText: string) {
|
||||
let owner = this._owner.get();
|
||||
if (!owner) {
|
||||
return;
|
||||
}
|
||||
public searchBarTextDidChange(searchBar: UISearchBar, searchText: string) {
|
||||
let owner = this._owner.get();
|
||||
if (!owner) {
|
||||
return;
|
||||
}
|
||||
|
||||
textProperty.nativeValueChange(owner, searchText);
|
||||
textProperty.nativeValueChange(owner, searchText);
|
||||
|
||||
// This code is needed since sometimes searchBarCancelButtonClicked is not called!
|
||||
if (searchText === "") {
|
||||
owner._emit(SearchBarBase.clearEvent);
|
||||
}
|
||||
}
|
||||
// This code is needed since sometimes searchBarCancelButtonClicked is not called!
|
||||
if (searchText === "") {
|
||||
owner._emit(SearchBarBase.clearEvent);
|
||||
}
|
||||
}
|
||||
|
||||
public searchBarCancelButtonClicked(searchBar: UISearchBar) {
|
||||
searchBar.resignFirstResponder();
|
||||
let owner = this._owner.get();
|
||||
if (!owner) {
|
||||
return;
|
||||
}
|
||||
public searchBarCancelButtonClicked(searchBar: UISearchBar) {
|
||||
searchBar.resignFirstResponder();
|
||||
let owner = this._owner.get();
|
||||
if (!owner) {
|
||||
return;
|
||||
}
|
||||
|
||||
owner._emit(SearchBarBase.clearEvent);
|
||||
}
|
||||
owner._emit(SearchBarBase.clearEvent);
|
||||
}
|
||||
|
||||
public searchBarSearchButtonClicked(searchBar: UISearchBar) {
|
||||
searchBar.resignFirstResponder();
|
||||
let owner = this._owner.get();
|
||||
if (!owner) {
|
||||
return;
|
||||
}
|
||||
public searchBarSearchButtonClicked(searchBar: UISearchBar) {
|
||||
searchBar.resignFirstResponder();
|
||||
let owner = this._owner.get();
|
||||
if (!owner) {
|
||||
return;
|
||||
}
|
||||
|
||||
owner._emit(SearchBarBase.submitEvent);
|
||||
}
|
||||
owner._emit(SearchBarBase.submitEvent);
|
||||
}
|
||||
}
|
||||
|
||||
class UISearchBarImpl extends UISearchBar {
|
||||
sizeThatFits(size: CGSize): CGSize {
|
||||
// iOS11 SDK does not support passing sizeThatFits(...) non-finite width value;
|
||||
// iOS layout system will take care to size the element properly when passed 0
|
||||
if (majorVersion >= 11 && size.width === Number.POSITIVE_INFINITY) {
|
||||
size.width = 0;
|
||||
}
|
||||
sizeThatFits(size: CGSize): CGSize {
|
||||
// iOS11 SDK does not support passing sizeThatFits(...) non-finite width value;
|
||||
// iOS layout system will take care to size the element properly when passed 0
|
||||
if (majorVersion >= 11 && size.width === Number.POSITIVE_INFINITY) {
|
||||
size.width = 0;
|
||||
}
|
||||
|
||||
return super.sizeThatFits(size);
|
||||
}
|
||||
return super.sizeThatFits(size);
|
||||
}
|
||||
}
|
||||
|
||||
export class SearchBar extends SearchBarBase {
|
||||
nativeViewProtected: UISearchBar;
|
||||
private _delegate;
|
||||
private __textField: UITextField;
|
||||
nativeViewProtected: UISearchBar;
|
||||
private _delegate;
|
||||
private __textField: UITextField;
|
||||
|
||||
createNativeView() {
|
||||
return UISearchBarImpl.new();
|
||||
}
|
||||
createNativeView() {
|
||||
return UISearchBarImpl.new();
|
||||
}
|
||||
|
||||
initNativeView() {
|
||||
super.initNativeView();
|
||||
this._delegate = UISearchBarDelegateImpl.initWithOwner(new WeakRef(this));
|
||||
}
|
||||
initNativeView() {
|
||||
super.initNativeView();
|
||||
this._delegate = UISearchBarDelegateImpl.initWithOwner(
|
||||
new WeakRef(this)
|
||||
);
|
||||
}
|
||||
|
||||
disposeNativeView() {
|
||||
this._delegate = null;
|
||||
super.disposeNativeView();
|
||||
}
|
||||
disposeNativeView() {
|
||||
this._delegate = null;
|
||||
super.disposeNativeView();
|
||||
}
|
||||
|
||||
public onLoaded() {
|
||||
super.onLoaded();
|
||||
this.ios.delegate = this._delegate;
|
||||
}
|
||||
public onLoaded() {
|
||||
super.onLoaded();
|
||||
this.ios.delegate = this._delegate;
|
||||
}
|
||||
|
||||
public onUnloaded() {
|
||||
this.ios.delegate = null;
|
||||
super.onUnloaded();
|
||||
}
|
||||
public onUnloaded() {
|
||||
this.ios.delegate = null;
|
||||
super.onUnloaded();
|
||||
}
|
||||
|
||||
public dismissSoftInput() {
|
||||
(<UIResponder>this.ios).resignFirstResponder();
|
||||
}
|
||||
public dismissSoftInput() {
|
||||
(<UIResponder>this.ios).resignFirstResponder();
|
||||
}
|
||||
|
||||
get ios(): UISearchBar {
|
||||
return this.nativeViewProtected;
|
||||
}
|
||||
get ios(): UISearchBar {
|
||||
return this.nativeViewProtected;
|
||||
}
|
||||
|
||||
get _textField(): UITextField {
|
||||
if (!this.__textField) {
|
||||
this.__textField = this.ios.valueForKey("searchField");
|
||||
}
|
||||
get _textField(): UITextField {
|
||||
if (!this.__textField) {
|
||||
this.__textField = this.ios.valueForKey("searchField");
|
||||
}
|
||||
|
||||
return this.__textField;
|
||||
}
|
||||
return this.__textField;
|
||||
}
|
||||
|
||||
[isEnabledProperty.setNative](value: boolean) {
|
||||
const nativeView = this.nativeViewProtected;
|
||||
if (nativeView instanceof UIControl) {
|
||||
nativeView.enabled = value;
|
||||
}
|
||||
[isEnabledProperty.setNative](value: boolean) {
|
||||
const nativeView = this.nativeViewProtected;
|
||||
if (nativeView instanceof UIControl) {
|
||||
nativeView.enabled = value;
|
||||
}
|
||||
|
||||
const textField = this._textField;
|
||||
if (textField) {
|
||||
textField.enabled = value;
|
||||
}
|
||||
}
|
||||
const textField = this._textField;
|
||||
if (textField) {
|
||||
textField.enabled = value;
|
||||
}
|
||||
}
|
||||
|
||||
[backgroundColorProperty.getDefault](): UIColor {
|
||||
return this.ios.barTintColor;
|
||||
}
|
||||
[backgroundColorProperty.setNative](value: UIColor | Color) {
|
||||
let color: UIColor = value instanceof Color ? value.ios : value;
|
||||
this.ios.barTintColor = color;
|
||||
}
|
||||
[backgroundColorProperty.getDefault](): UIColor {
|
||||
return this.ios.barTintColor;
|
||||
}
|
||||
[backgroundColorProperty.setNative](value: UIColor | Color) {
|
||||
let color: UIColor = value instanceof Color ? value.ios : value;
|
||||
this.ios.barTintColor = color;
|
||||
}
|
||||
|
||||
[colorProperty.getDefault](): UIColor {
|
||||
let sf = this._textField;
|
||||
if (sf) {
|
||||
return sf.textColor;
|
||||
}
|
||||
[colorProperty.getDefault](): UIColor {
|
||||
let sf = this._textField;
|
||||
if (sf) {
|
||||
return sf.textColor;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
[colorProperty.setNative](value: UIColor | Color) {
|
||||
let sf = this._textField;
|
||||
let color = value instanceof Color ? value.ios : value;
|
||||
if (sf) {
|
||||
sf.textColor = color;
|
||||
sf.tintColor = color;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
[colorProperty.setNative](value: UIColor | Color) {
|
||||
let sf = this._textField;
|
||||
let color = value instanceof Color ? value.ios : value;
|
||||
if (sf) {
|
||||
sf.textColor = color;
|
||||
sf.tintColor = color;
|
||||
}
|
||||
}
|
||||
|
||||
[fontInternalProperty.getDefault](): UIFont {
|
||||
let sf = this._textField;
|
||||
[fontInternalProperty.getDefault](): UIFont {
|
||||
let sf = this._textField;
|
||||
|
||||
return sf ? sf.font : null;
|
||||
}
|
||||
[fontInternalProperty.setNative](value: UIFont | Font) {
|
||||
let sf = this._textField;
|
||||
if (sf) {
|
||||
sf.font = value instanceof Font ? value.getUIFont(sf.font) : value;
|
||||
}
|
||||
}
|
||||
return sf ? sf.font : null;
|
||||
}
|
||||
[fontInternalProperty.setNative](value: UIFont | Font) {
|
||||
let sf = this._textField;
|
||||
if (sf) {
|
||||
sf.font = value instanceof Font ? value.getUIFont(sf.font) : value;
|
||||
}
|
||||
}
|
||||
|
||||
[backgroundInternalProperty.getDefault](): any {
|
||||
return null;
|
||||
}
|
||||
[backgroundInternalProperty.setNative](value: any) {
|
||||
//
|
||||
}
|
||||
[backgroundInternalProperty.getDefault](): any {
|
||||
return null;
|
||||
}
|
||||
[backgroundInternalProperty.setNative](value: any) {
|
||||
//
|
||||
}
|
||||
|
||||
[textProperty.getDefault](): string {
|
||||
return "";
|
||||
}
|
||||
[textProperty.setNative](value: string) {
|
||||
const text = (value === null || value === undefined) ? "" : value.toString();
|
||||
this.ios.text = text;
|
||||
}
|
||||
[textProperty.getDefault](): string {
|
||||
return "";
|
||||
}
|
||||
[textProperty.setNative](value: string) {
|
||||
const text =
|
||||
value === null || value === undefined ? "" : value.toString();
|
||||
this.ios.text = text;
|
||||
}
|
||||
|
||||
[hintProperty.getDefault](): string {
|
||||
return "";
|
||||
}
|
||||
[hintProperty.setNative](value: string) {
|
||||
this._updateAttributedPlaceholder();
|
||||
}
|
||||
[hintProperty.getDefault](): string {
|
||||
return "";
|
||||
}
|
||||
[hintProperty.setNative](value: string) {
|
||||
this._updateAttributedPlaceholder();
|
||||
}
|
||||
|
||||
[textFieldBackgroundColorProperty.getDefault](): UIColor {
|
||||
const textField = this._textField;
|
||||
if (textField) {
|
||||
return textField.backgroundColor;
|
||||
}
|
||||
[textFieldBackgroundColorProperty.getDefault](): UIColor {
|
||||
const textField = this._textField;
|
||||
if (textField) {
|
||||
return textField.backgroundColor;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
[textFieldBackgroundColorProperty.setNative](value: Color | UIColor) {
|
||||
const color = value instanceof Color ? value.ios : value;
|
||||
const textField = this._textField;
|
||||
if (textField) {
|
||||
textField.backgroundColor = color;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
[textFieldBackgroundColorProperty.setNative](value: Color | UIColor) {
|
||||
const color = value instanceof Color ? value.ios : value;
|
||||
const textField = this._textField;
|
||||
if (textField) {
|
||||
textField.backgroundColor = color;
|
||||
}
|
||||
}
|
||||
|
||||
[textFieldHintColorProperty.getDefault](): UIColor {
|
||||
return null;
|
||||
}
|
||||
[textFieldHintColorProperty.setNative](value: Color | UIColor) {
|
||||
this._updateAttributedPlaceholder();
|
||||
}
|
||||
[textFieldHintColorProperty.getDefault](): UIColor {
|
||||
return null;
|
||||
}
|
||||
[textFieldHintColorProperty.setNative](value: Color | UIColor) {
|
||||
this._updateAttributedPlaceholder();
|
||||
}
|
||||
|
||||
// Very similar to text-field.ios.ts implementation. Maybe unify APIs and base classes?
|
||||
_updateAttributedPlaceholder(): void {
|
||||
let stringValue = this.hint;
|
||||
if (stringValue === null || stringValue === void 0) {
|
||||
stringValue = "";
|
||||
} else {
|
||||
stringValue = stringValue + "";
|
||||
}
|
||||
if (stringValue === "") {
|
||||
// we do not use empty string since initWithStringAttributes does not return proper value and
|
||||
// nativeView.attributedPlaceholder will be null
|
||||
stringValue = " ";
|
||||
}
|
||||
const attributes: any = {};
|
||||
if (this.textFieldHintColor) {
|
||||
attributes[NSForegroundColorAttributeName] = this.textFieldHintColor.ios;
|
||||
}
|
||||
const attributedPlaceholder = NSAttributedString.alloc().initWithStringAttributes(stringValue, attributes);
|
||||
this._textField.attributedPlaceholder = attributedPlaceholder;
|
||||
}
|
||||
// Very similar to text-field.ios.ts implementation. Maybe unify APIs and base classes?
|
||||
_updateAttributedPlaceholder(): void {
|
||||
let stringValue = this.hint;
|
||||
if (stringValue === null || stringValue === void 0) {
|
||||
stringValue = "";
|
||||
} else {
|
||||
stringValue = stringValue + "";
|
||||
}
|
||||
if (stringValue === "") {
|
||||
// we do not use empty string since initWithStringAttributes does not return proper value and
|
||||
// nativeView.attributedPlaceholder will be null
|
||||
stringValue = " ";
|
||||
}
|
||||
const attributes: any = {};
|
||||
if (this.textFieldHintColor) {
|
||||
attributes[
|
||||
NSForegroundColorAttributeName
|
||||
] = this.textFieldHintColor.ios;
|
||||
}
|
||||
const attributedPlaceholder = NSAttributedString.alloc().initWithStringAttributes(
|
||||
stringValue,
|
||||
attributes
|
||||
);
|
||||
this._textField.attributedPlaceholder = attributedPlaceholder;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,27 +5,46 @@ import { Color } from "../../color";
|
||||
import { isIOS } from "../../platform";
|
||||
|
||||
@CSSType("SearchBar")
|
||||
export abstract class SearchBarBase extends View implements SearchBarDefinition {
|
||||
public static submitEvent = "submit";
|
||||
public static clearEvent = "clear";
|
||||
public text: string;
|
||||
public hint: string;
|
||||
public textFieldBackgroundColor: Color;
|
||||
public textFieldHintColor: Color;
|
||||
export abstract class SearchBarBase extends View
|
||||
implements SearchBarDefinition {
|
||||
public static submitEvent = "submit";
|
||||
public static clearEvent = "clear";
|
||||
public text: string;
|
||||
public hint: string;
|
||||
public textFieldBackgroundColor: Color;
|
||||
public textFieldHintColor: Color;
|
||||
|
||||
public abstract dismissSoftInput();
|
||||
public abstract dismissSoftInput();
|
||||
}
|
||||
|
||||
SearchBarBase.prototype.recycleNativeView = "auto";
|
||||
|
||||
export const textProperty = new Property<SearchBarBase, string>({ name: "text", defaultValue: "", affectsLayout: isIOS });
|
||||
export const textProperty = new Property<SearchBarBase, string>({
|
||||
name: "text",
|
||||
defaultValue: "",
|
||||
affectsLayout: isIOS,
|
||||
});
|
||||
textProperty.register(SearchBarBase);
|
||||
|
||||
export const hintProperty = new Property<SearchBarBase, string>({ name: "hint", defaultValue: "" });
|
||||
export const hintProperty = new Property<SearchBarBase, string>({
|
||||
name: "hint",
|
||||
defaultValue: "",
|
||||
});
|
||||
hintProperty.register(SearchBarBase);
|
||||
|
||||
export const textFieldHintColorProperty = new Property<SearchBarBase, Color>({ name: "textFieldHintColor", equalityComparer: Color.equals, valueConverter: (v) => new Color(v) });
|
||||
export const textFieldHintColorProperty = new Property<SearchBarBase, Color>({
|
||||
name: "textFieldHintColor",
|
||||
equalityComparer: Color.equals,
|
||||
valueConverter: (v) => new Color(v),
|
||||
});
|
||||
textFieldHintColorProperty.register(SearchBarBase);
|
||||
|
||||
export const textFieldBackgroundColorProperty = new Property<SearchBarBase, Color>({ name: "textFieldBackgroundColor", equalityComparer: Color.equals, valueConverter: (v) => new Color(v) });
|
||||
export const textFieldBackgroundColorProperty = new Property<
|
||||
SearchBarBase,
|
||||
Color
|
||||
>({
|
||||
name: "textFieldBackgroundColor",
|
||||
equalityComparer: Color.equals,
|
||||
valueConverter: (v) => new Color(v),
|
||||
});
|
||||
textFieldBackgroundColorProperty.register(SearchBarBase);
|
||||
|
||||
Reference in New Issue
Block a user