javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-11-05 13:26:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

Made SegmentedBarItem bindable.

Browse Source
This commit is contained in:
Rossen Hristov
2015-08-31 13:07:19 +03:00
parent b334b7e5c4
commit bc2e271e72
5 changed files with 78 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/tests/ui/segmented-bar/segmented-bar-tests.ts
View File

@@ -29,7 +29,7 @@ function _createSegmentedBar(): segmentedBarModule.SegmentedBar {
function _createItems(count: number): Array<segmentedBarModule.SegmentedBarItem> {
var items = new Array<segmentedBarModule.SegmentedBarItem>();
for (var i = 0; i < count; i++) {
items.push({ title: i + "" });
items.push(new segmentedBarModule.SegmentedBarItem({ title: i + "" }));
}
return items;
}

39
ui/segmented-bar/segmented-bar-common.ts
View File

@@ -4,11 +4,32 @@ import proxy = require("ui/core/proxy");
import dependencyObservable = require("ui/core/dependency-observable");
import color = require("color");
import types = require("utils/types");
import bindable = require("ui/core/bindable");
export module knownCollections {
export var items = "items";
}
export class SegmentedBarItem extends bindable.Bindable implements definition.SegmentedBarItem {
private _title: string;
public _parent: SegmentedBar;
get title(): string {
return this._title;
}
set title(value: string) {
if (this._title !== value) {
this._title = value;
this._update();
}
}
public _update() {
//
}
}
export class SegmentedBar extends view.View implements definition.SegmentedBar {
public _addArrayFromBuilder(name: string, value: Array<any>) {
if (name === "items") {
@@ -52,7 +73,19 @@ export class SegmentedBar extends view.View implements definition.SegmentedBar {
value instanceof color.Color ? value : new color.Color(<any>value));
}
public static selectedBackgroundColorProperty = new dependencyObservable.Property("selectedBackgroundColor", "SegmentedBar", new proxy.PropertyMetadata(undefined))
public static selectedIndexProperty = new dependencyObservable.Property("selectedIndex", "SegmentedBar", new proxy.PropertyMetadata(undefined))
public static itemsProperty = new dependencyObservable.Property("items", "SegmentedBar", new proxy.PropertyMetadata(undefined))
public static selectedBackgroundColorProperty = new dependencyObservable.Property("selectedBackgroundColor", "SegmentedBar", new proxy.PropertyMetadata(undefined));
public static selectedIndexProperty = new dependencyObservable.Property("selectedIndex", "SegmentedBar", new proxy.PropertyMetadata(undefined));
public static itemsProperty = new dependencyObservable.Property("items", "SegmentedBar", new proxy.PropertyMetadata(undefined));
public _onBindingContextChanged(oldValue: any, newValue: any) {
super._onBindingContextChanged(oldValue, newValue);
if (this.items && this.items.length > 0) {
var i = 0;
var length = this.items.length;
for (; i < length; i++) {
console.log(`this.items[i].bindingContext = ${newValue};`);
this.items[i].bindingContext = newValue;
}
}
}
}

22
ui/segmented-bar/segmented-bar.android.ts
View File

@@ -31,6 +31,12 @@ function onItemsPropertyChanged(data: dependencyObservable.PropertyChangeData) {
return;
}
var oldItems = <Array<definition.SegmentedBarItem>>data.oldValue;
if (oldItems && oldItems.length) {
for (var i = 0; i < oldItems.length; i++) {
(<SegmentedBarItem>oldItems[i])._parent = null;
}
}
view.android.clearAllTabs();
var newItems = <Array<definition.SegmentedBarItem>>data.newValue;
@@ -39,7 +45,8 @@ function onItemsPropertyChanged(data: dependencyObservable.PropertyChangeData) {
if (newItems && newItems.length) {
for (var i = 0; i < newItems.length; i++) {
var title = newItems[i].title;
(<SegmentedBarItem>newItems[i])._parent = view;
var title = "" + newItems[i].title;
var tab = view.android.newTabSpec(i + "");
tab.setIndicator(title);
@@ -109,6 +116,19 @@ class SegmentedBarColorDrawable extends android.graphics.drawable.ColorDrawable
}
}
export class SegmentedBarItem extends common.SegmentedBarItem {
public _update() {
if (this._parent && this._parent.android) {
// TabHost.TabSpec.setIndicator DOES NOT WORK once the title has been set.
// http://stackoverflow.com/questions/2935781/modify-tab-indicator-dynamically-in-android
var tabIndex = this._parent.items.indexOf(this);
var titleTextViewId = 16908310; // http://developer.android.com/reference/android/R.id.html#title
var titleTextView = <android.widget.TextView>this._parent.android.getTabWidget().getChildAt(tabIndex).findViewById(titleTextViewId);
titleTextView.setText("" + this.title);
}
}
}
export class SegmentedBar extends common.SegmentedBar {
private _android: OurTabHost;
public _listener: android.widget.TabHost.OnTabChangeListener;

5
ui/segmented-bar/segmented-bar.d.ts vendored
View File

@@ -5,15 +5,16 @@ declare module "ui/segmented-bar" {
import view = require("ui/core/view");
import dependencyObservable = require("ui/core/dependency-observable");
import color = require("color");
import bindable = require("ui/core/bindable");
/**
* Represents a SegmentedBar item.
*/
interface SegmentedBarItem {
class SegmentedBarItem extends bindable.Bindable {
/**
* Gets or sets the title of the SegmentedBarItem.
*/
title: string;
public title: string;
}
/**

20
ui/segmented-bar/segmented-bar.ios.ts
View File

@@ -31,15 +31,20 @@ function onItemsPropertyChanged(data: dependencyObservable.PropertyChangeData) {
return;
}
var newItems = <Array<definition.SegmentedBarItem>>data.newValue;
var oldItems = <Array<definition.SegmentedBarItem>>data.oldValue;
if (oldItems && oldItems.length) {
for (var i = 0; i < oldItems.length; i++) {
(<SegmentedBarItem>oldItems[i])._parent = null;
}
}
view._adjustSelectedIndex(newItems);
view.ios.removeAllSegments();
var newItems = <Array<definition.SegmentedBarItem>>data.newValue;
if (newItems && newItems.length) {
for (var i = 0; i < newItems.length; i++) {
view.ios.insertSegmentWithTitleAtIndexAnimated(newItems[i].title, i, false);
(<SegmentedBarItem>newItems[i])._parent = view;
}
if (view.ios.selectedSegmentIndex !== view.selectedIndex) {
@@ -61,6 +66,15 @@ function onSelectedBackgroundColorPropertyChanged(data: dependencyObservable.Pro
}
(<proxy.PropertyMetadata>common.SegmentedBar.selectedBackgroundColorProperty.metadata).onSetNativeValue = onSelectedBackgroundColorPropertyChanged;
export class SegmentedBarItem extends common.SegmentedBarItem {
public _update() {
if (this._parent) {
var tabIndex = this._parent.items.indexOf(this);
this._parent.ios.setTitleForSegmentAtIndex("" + this.title, tabIndex);
}
}
}
export class SegmentedBar extends common.SegmentedBar {
private _ios: UISegmentedControl;
private _selectionHandler: NSObject;