feat:Input add password property

This commit is contained in:
pengfeizhou 2021-02-08 18:18:37 +08:00 committed by osborn
parent 521ce19c1c
commit 07c701ef23
12 changed files with 170 additions and 86 deletions

View File

@ -24,6 +24,7 @@ import android.text.TextWatcher;
import android.util.TypedValue; import android.util.TypedValue;
import android.view.Gravity; import android.view.Gravity;
import android.view.View; import android.view.View;
import android.view.inputmethod.EditorInfo;
import android.view.inputmethod.InputMethodManager; import android.view.inputmethod.InputMethodManager;
import android.widget.EditText; import android.widget.EditText;
@ -123,23 +124,68 @@ public class InputNode extends ViewNode<EditText> implements TextWatcher, View.O
break; break;
case "inputType": case "inputType":
if (prop.isNumber()) { if (prop.isNumber()) {
final int variation =
mView.getInputType() & (EditorInfo.TYPE_MASK_CLASS | EditorInfo.TYPE_MASK_VARIATION);
boolean isPassword = variation
== (EditorInfo.TYPE_CLASS_TEXT | EditorInfo.TYPE_TEXT_VARIATION_PASSWORD)
|| variation
== (EditorInfo.TYPE_CLASS_TEXT | EditorInfo.TYPE_TEXT_VARIATION_WEB_PASSWORD)
|| variation
== (EditorInfo.TYPE_CLASS_NUMBER | EditorInfo.TYPE_NUMBER_VARIATION_PASSWORD);
int inputType;
switch (prop.asNumber().toInt()) { switch (prop.asNumber().toInt()) {
case 1: case 1:
mView.setInputType(InputType.TYPE_CLASS_NUMBER | InputType.TYPE_NUMBER_VARIATION_NORMAL); inputType = InputType.TYPE_CLASS_NUMBER | InputType.TYPE_NUMBER_VARIATION_NORMAL;
if (isPassword) {
inputType = inputType | InputType.TYPE_NUMBER_VARIATION_PASSWORD;
}
break; break;
case 2: case 2:
mView.setInputType(InputType.TYPE_CLASS_NUMBER | InputType.TYPE_NUMBER_FLAG_DECIMAL); inputType = InputType.TYPE_CLASS_NUMBER | InputType.TYPE_NUMBER_FLAG_DECIMAL;
if (isPassword) {
inputType = inputType | InputType.TYPE_NUMBER_VARIATION_PASSWORD;
}
break; break;
case 3: case 3:
mView.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS); inputType = InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS;
if (isPassword) {
inputType = inputType | InputType.TYPE_TEXT_VARIATION_PASSWORD;
}
break; break;
case 4: case 4:
mView.setInputType(InputType.TYPE_CLASS_PHONE); inputType = InputType.TYPE_CLASS_PHONE;
if (isPassword) {
inputType = inputType | InputType.TYPE_NUMBER_VARIATION_PASSWORD;
}
break; break;
default: default:
mView.setInputType(InputType.TYPE_CLASS_TEXT); inputType = InputType.TYPE_CLASS_TEXT;
if (isPassword) {
inputType = inputType | InputType.TYPE_TEXT_VARIATION_PASSWORD;
}
break; break;
} }
mView.setInputType(inputType);
}
break;
case "password":
if (prop.isBoolean()) {
final int variation =
mView.getInputType() & (EditorInfo.TYPE_MASK_CLASS | EditorInfo.TYPE_MASK_VARIATION);
if ((variation & EditorInfo.TYPE_CLASS_NUMBER) == EditorInfo.TYPE_CLASS_NUMBER) {
if (prop.asBoolean().value()) {
mView.setInputType(mView.getInputType() | InputType.TYPE_NUMBER_VARIATION_PASSWORD);
} else {
mView.setInputType(mView.getInputType() & (~InputType.TYPE_NUMBER_VARIATION_PASSWORD));
}
} else {
if (prop.asBoolean().value()) {
mView.setInputType(mView.getInputType() | InputType.TYPE_TEXT_VARIATION_PASSWORD);
} else {
mView.setInputType(mView.getInputType() & (~InputType.TYPE_TEXT_VARIATION_PASSWORD));
}
}
} }
break; break;
default: default:

View File

@ -1,86 +1,97 @@
import { Panel, Group, scroller, vlayout, layoutConfig, LayoutSpec, Input, Gravity, log, Color, input, text, InputType } from "doric"; import {
Panel,
Group,
scroller,
vlayout,
layoutConfig,
LayoutSpec,
Input,
Gravity,
log,
Color,
input,
text,
InputType,
} from "doric";
import { title, colors } from "./utils"; import { title, colors } from "./utils";
function getInput(c: Partial<Input>) { function getInput(c: Partial<Input>) {
const inputView = input(c) const inputView = input(c);
const isFocused = text({ const isFocused = text({
layoutConfig: { layoutConfig: {
widthSpec: LayoutSpec.MOST, widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST, heightSpec: LayoutSpec.JUST,
}, },
height: 50, height: 50,
}) });
const inputed = text({ const inputed = text({
layoutConfig: { layoutConfig: {
widthSpec: LayoutSpec.MOST, widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST, heightSpec: LayoutSpec.JUST,
}, },
height: 50, height: 50,
}) });
inputView.onFocusChange = (onFocusChange) => { inputView.onFocusChange = (onFocusChange) => {
isFocused.text = onFocusChange ? `Focused` : `Unfocused` isFocused.text = onFocusChange ? `Focused` : `Unfocused`;
} };
inputView.onTextChange = (text) => { inputView.onTextChange = (text) => {
inputed.text = `Inputed:${text}` inputed.text = `Inputed:${text}`;
} };
return [inputView, isFocused, inputed] return [inputView, isFocused, inputed];
} }
@Entry @Entry
class InputDemo extends Panel { class InputDemo extends Panel {
build(root: Group) { build(root: Group) {
var [inputView, ...otherView] = getInput({ var [inputView, ...otherView] = getInput({
layoutConfig: { layoutConfig: {
widthSpec: LayoutSpec.FIT, widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT, heightSpec: LayoutSpec.FIT,
}, },
hintText: "Please input something in one line", hintText: "Please input something in one line",
border: { border: {
width: 1, width: 1,
color: Color.GRAY, color: Color.GRAY,
}, },
multiline: false, multiline: false,
textSize: 20, textSize: 20,
maxLength: 20, maxLength: 20,
padding: { top: 10, bottom: 11 }, padding: { top: 10, bottom: 11 },
inputType: InputType.Decimal inputType: InputType.Decimal,
}); password: true,
scroller( });
vlayout( scroller(
[ vlayout(
[
title("Demo"), title("Demo"),
// ...getInput({ // ...getInput({
// layoutConfig: { // layoutConfig: {
// widthSpec: LayoutSpec.JUST, // widthSpec: LayoutSpec.JUST,
// heightSpec: LayoutSpec.FIT, // heightSpec: LayoutSpec.FIT,
// }, // },
// width: 300, // width: 300,
// hintText: "Please input something", // hintText: "Please input something",
// border: { // border: {
// width: 1, // width: 1,
// color: Color.GRAY, // color: Color.GRAY,
// }, // },
// textSize: 40, // textSize: 40,
// maxLength: 20, // maxLength: 20,
// }), // }),
inputView, inputView,
...otherView, ...otherView,
], ],
{ {
space: 10, space: 10,
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.MOST), layoutConfig: layoutConfig().most().configHeight(LayoutSpec.MOST),
onClick: () => { onClick: () => {
(inputView as Input).releaseFocus(context); (inputView as Input).releaseFocus(context);
} },
} }
), ),
{ {
layoutConfig: layoutConfig().most() layoutConfig: layoutConfig().most(),
} }
).in(root) ).in(root);
} }
} }

View File

@ -104,8 +104,8 @@ - (void)blendView:(DoricInputView *)view forPropName:(NSString *)name propValue:
} }
view.textAlignment = alignment; view.textAlignment = alignment;
} else if ([name isEqualToString:@"multiline"]) { } else if ([name isEqualToString:@"multiline"]) {
BOOL mutilin = [(NSNumber *) prop boolValue]; BOOL value = [(NSNumber *) prop boolValue];
if (!mutilin) { if (!value) {
view.textContainer.maximumNumberOfLines = 1; view.textContainer.maximumNumberOfLines = 1;
} else { } else {
view.textContainer.maximumNumberOfLines = 0; view.textContainer.maximumNumberOfLines = 0;
@ -156,6 +156,8 @@ - (void)blendView:(DoricInputView *)view forPropName:(NSString *)name propValue:
break; break;
} }
} }
} else if ([name isEqualToString:@"password"]) {
self.view.secureTextEntry = [(NSNumber *) prop boolValue];
} else { } else {
[super blendView:view forPropName:name propValue:prop]; [super blendView:view forPropName:name propValue:prop];
} }

View File

@ -2711,6 +2711,10 @@ var Input = /** @class */ (function (_super) {
Property, Property,
__metadata$a("design:type", Number) __metadata$a("design:type", Number)
], Input.prototype, "maxLength", void 0); ], Input.prototype, "maxLength", void 0);
__decorate$a([
Property,
__metadata$a("design:type", Boolean)
], Input.prototype, "password", void 0);
return Input; return Input;
}(View)); }(View));
(function (InputType) { (function (InputType) {

View File

@ -2101,6 +2101,10 @@ __decorate$a([
Property, Property,
__metadata$a("design:type", Number) __metadata$a("design:type", Number)
], Input.prototype, "maxLength", void 0); ], Input.prototype, "maxLength", void 0);
__decorate$a([
Property,
__metadata$a("design:type", Boolean)
], Input.prototype, "password", void 0);
(function (InputType) { (function (InputType) {
InputType[InputType["Default"] = 0] = "Default"; InputType[InputType["Default"] = 0] = "Default";
InputType[InputType["Number"] = 1] = "Number"; InputType[InputType["Number"] = 1] = "Number";

View File

@ -3590,6 +3590,10 @@ __decorate$a([
Property, Property,
__metadata$a("design:type", Number) __metadata$a("design:type", Number)
], Input.prototype, "maxLength", void 0); ], Input.prototype, "maxLength", void 0);
__decorate$a([
Property,
__metadata$a("design:type", Boolean)
], Input.prototype, "password", void 0);
(function (InputType) { (function (InputType) {
InputType[InputType["Default"] = 0] = "Default"; InputType[InputType["Default"] = 0] = "Default";
InputType[InputType["Number"] = 1] = "Number"; InputType[InputType["Number"] = 1] = "Number";

1
doric-js/index.d.ts vendored
View File

@ -744,6 +744,7 @@ declare module 'doric/lib/src/widget/input' {
onTextChange?: (text: string) => void; onTextChange?: (text: string) => void;
onFocusChange?: (focused: boolean) => void; onFocusChange?: (focused: boolean) => void;
maxLength?: number; maxLength?: number;
password?: boolean;
getText(context: BridgeContext): Promise<string>; getText(context: BridgeContext): Promise<string>;
setSelection(context: BridgeContext, start: number, end?: number): Promise<string>; setSelection(context: BridgeContext, start: number, end?: number): Promise<string>;
requestFocus(context: BridgeContext): Promise<any>; requestFocus(context: BridgeContext): Promise<any>;

View File

@ -14,6 +14,7 @@ export declare class Input extends View {
onTextChange?: (text: string) => void; onTextChange?: (text: string) => void;
onFocusChange?: (focused: boolean) => void; onFocusChange?: (focused: boolean) => void;
maxLength?: number; maxLength?: number;
password?: boolean;
getText(context: BridgeContext): Promise<string>; getText(context: BridgeContext): Promise<string>;
setSelection(context: BridgeContext, start: number, end?: number): Promise<string>; setSelection(context: BridgeContext, start: number, end?: number): Promise<string>;
requestFocus(context: BridgeContext): Promise<any>; requestFocus(context: BridgeContext): Promise<any>;

View File

@ -87,6 +87,10 @@ __decorate([
Property, Property,
__metadata("design:type", Number) __metadata("design:type", Number)
], Input.prototype, "maxLength", void 0); ], Input.prototype, "maxLength", void 0);
__decorate([
Property,
__metadata("design:type", Boolean)
], Input.prototype, "password", void 0);
export var InputType; export var InputType;
(function (InputType) { (function (InputType) {
InputType[InputType["Default"] = 0] = "Default"; InputType[InputType["Default"] = 0] = "Default";

View File

@ -54,6 +54,9 @@ export class Input extends View {
@Property @Property
maxLength?: number maxLength?: number
@Property
password?: boolean
getText(context: BridgeContext) { getText(context: BridgeContext) {
return this.nativeChannel(context, 'getText')() as Promise<string> return this.nativeChannel(context, 'getText')() as Promise<string>
} }

View File

@ -3648,6 +3648,10 @@ __decorate$a([
Property, Property,
__metadata$a("design:type", Number) __metadata$a("design:type", Number)
], Input.prototype, "maxLength", void 0); ], Input.prototype, "maxLength", void 0);
__decorate$a([
Property,
__metadata$a("design:type", Boolean)
], Input.prototype, "password", void 0);
(function (InputType) { (function (InputType) {
InputType[InputType["Default"] = 0] = "Default"; InputType[InputType["Default"] = 0] = "Default";
InputType[InputType["Number"] = 1] = "Number"; InputType[InputType["Number"] = 1] = "Number";

File diff suppressed because one or more lines are too long