feat: slider support set max and min scale
This commit is contained in:
parent
fd5994e270
commit
c05c169dd7
@ -51,8 +51,8 @@ public class SliderNode extends SuperNode<RecyclerView> {
|
|||||||
private String renderPageFuncId;
|
private String renderPageFuncId;
|
||||||
private boolean scrollable = true;
|
private boolean scrollable = true;
|
||||||
private String slideStyle = null;
|
private String slideStyle = null;
|
||||||
private static final float MIN_SCALE = 0.5f;
|
private float minScale = 0.618f;
|
||||||
private static final float MAX_SCALE = 1;
|
private float maxScale = 1;
|
||||||
|
|
||||||
public SliderNode(DoricContext doricContext) {
|
public SliderNode(DoricContext doricContext) {
|
||||||
super(doricContext);
|
super(doricContext);
|
||||||
@ -133,9 +133,10 @@ public class SliderNode extends SuperNode<RecyclerView> {
|
|||||||
if (child.getWidth() == 0) {
|
if (child.getWidth() == 0) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
float centerX = (child.getLeft() + child.getRight()) / 2.f;
|
float centerX = recyclerView.getWidth() / 2.f;
|
||||||
float percent = 1 - Math.abs(recyclerView.getWidth() / 2f - centerX) / recyclerView.getWidth() / 2f;
|
float vCenterX = (child.getLeft() + child.getRight()) / 2.f;
|
||||||
float scaleFactor = MIN_SCALE + Math.abs(percent) * (MAX_SCALE - MIN_SCALE);
|
float percent = 1 - Math.abs(centerX - vCenterX) / centerX;
|
||||||
|
float scaleFactor = minScale + Math.abs(percent) * (maxScale - minScale);
|
||||||
child.setLayoutParams(lp);
|
child.setLayoutParams(lp);
|
||||||
child.setScaleY(scaleFactor);
|
child.setScaleY(scaleFactor);
|
||||||
child.setScaleX(scaleFactor);
|
child.setScaleX(scaleFactor);
|
||||||
@ -246,6 +247,10 @@ public class SliderNode extends SuperNode<RecyclerView> {
|
|||||||
case "slideStyle":
|
case "slideStyle":
|
||||||
if (prop.isString()) {
|
if (prop.isString()) {
|
||||||
this.slideStyle = prop.asString().value();
|
this.slideStyle = prop.asString().value();
|
||||||
|
} else if (prop.isObject()) {
|
||||||
|
this.slideStyle = prop.asObject().getProperty("type").asString().value();
|
||||||
|
this.maxScale = prop.asObject().getProperty("maxScale").asNumber().toFloat();
|
||||||
|
this.minScale = prop.asObject().getProperty("minScale").asNumber().toFloat();
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
|
@ -2727,7 +2727,7 @@ var Slider = /** @class */ (function (_super) {
|
|||||||
], Slider.prototype, "bounces", void 0);
|
], Slider.prototype, "bounces", void 0);
|
||||||
__decorate$9([
|
__decorate$9([
|
||||||
Property,
|
Property,
|
||||||
__metadata$9("design:type", String)
|
__metadata$9("design:type", Object)
|
||||||
], Slider.prototype, "slideStyle", void 0);
|
], Slider.prototype, "slideStyle", void 0);
|
||||||
return Slider;
|
return Slider;
|
||||||
}(Superview));
|
}(Superview));
|
||||||
|
@ -2068,7 +2068,7 @@ __decorate$9([
|
|||||||
], Slider.prototype, "bounces", void 0);
|
], Slider.prototype, "bounces", void 0);
|
||||||
__decorate$9([
|
__decorate$9([
|
||||||
Property,
|
Property,
|
||||||
__metadata$9("design:type", String)
|
__metadata$9("design:type", Object)
|
||||||
], Slider.prototype, "slideStyle", void 0);
|
], Slider.prototype, "slideStyle", void 0);
|
||||||
function slider(config) {
|
function slider(config) {
|
||||||
const ret = new Slider;
|
const ret = new Slider;
|
||||||
|
@ -3596,7 +3596,7 @@ __decorate$9([
|
|||||||
], Slider.prototype, "bounces", void 0);
|
], Slider.prototype, "bounces", void 0);
|
||||||
__decorate$9([
|
__decorate$9([
|
||||||
Property,
|
Property,
|
||||||
__metadata$9("design:type", String)
|
__metadata$9("design:type", Object)
|
||||||
], Slider.prototype, "slideStyle", void 0);
|
], Slider.prototype, "slideStyle", void 0);
|
||||||
function slider(config) {
|
function slider(config) {
|
||||||
const ret = new Slider;
|
const ret = new Slider;
|
||||||
|
10
doric-js/index.d.ts
vendored
10
doric-js/index.d.ts
vendored
@ -810,7 +810,15 @@ declare module 'doric/lib/src/widget/slider' {
|
|||||||
* Take effect only on iOS
|
* Take effect only on iOS
|
||||||
*/
|
*/
|
||||||
bounces?: boolean;
|
bounces?: boolean;
|
||||||
slideStyle?: "zoomOut";
|
/**
|
||||||
|
* Set the effect when sliding
|
||||||
|
* ZoomOut is currently supported
|
||||||
|
*/
|
||||||
|
slideStyle?: "zoomOut" | {
|
||||||
|
type: "zoomOut";
|
||||||
|
minScale: number;
|
||||||
|
maxScale: number;
|
||||||
|
};
|
||||||
slidePage(context: BridgeContext, page: number, smooth?: boolean): Promise<any>;
|
slidePage(context: BridgeContext, page: number, smooth?: boolean): Promise<any>;
|
||||||
getSlidedPage(context: BridgeContext): Promise<number>;
|
getSlidedPage(context: BridgeContext): Promise<number>;
|
||||||
}
|
}
|
||||||
|
10
doric-js/lib/src/widget/slider.d.ts
vendored
10
doric-js/lib/src/widget/slider.d.ts
vendored
@ -20,7 +20,15 @@ export declare class Slider extends Superview {
|
|||||||
* Take effect only on iOS
|
* Take effect only on iOS
|
||||||
*/
|
*/
|
||||||
bounces?: boolean;
|
bounces?: boolean;
|
||||||
slideStyle?: "zoomOut";
|
/**
|
||||||
|
* Set the effect when sliding
|
||||||
|
* ZoomOut is currently supported
|
||||||
|
*/
|
||||||
|
slideStyle?: "zoomOut" | {
|
||||||
|
type: "zoomOut";
|
||||||
|
minScale: number;
|
||||||
|
maxScale: number;
|
||||||
|
};
|
||||||
private getItem;
|
private getItem;
|
||||||
private renderBunchedItems;
|
private renderBunchedItems;
|
||||||
slidePage(context: BridgeContext, page: number, smooth?: boolean): Promise<any>;
|
slidePage(context: BridgeContext, page: number, smooth?: boolean): Promise<any>;
|
||||||
|
@ -90,7 +90,7 @@ __decorate([
|
|||||||
], Slider.prototype, "bounces", void 0);
|
], Slider.prototype, "bounces", void 0);
|
||||||
__decorate([
|
__decorate([
|
||||||
Property,
|
Property,
|
||||||
__metadata("design:type", String)
|
__metadata("design:type", Object)
|
||||||
], Slider.prototype, "slideStyle", void 0);
|
], Slider.prototype, "slideStyle", void 0);
|
||||||
export function slider(config) {
|
export function slider(config) {
|
||||||
const ret = new Slider;
|
const ret = new Slider;
|
||||||
|
@ -56,9 +56,12 @@ export class Slider extends Superview {
|
|||||||
*/
|
*/
|
||||||
@Property
|
@Property
|
||||||
bounces?: boolean
|
bounces?: boolean
|
||||||
|
/**
|
||||||
|
* Set the effect when sliding
|
||||||
|
* ZoomOut is currently supported
|
||||||
|
*/
|
||||||
@Property
|
@Property
|
||||||
slideStyle?: "zoomOut"
|
slideStyle?: "zoomOut" | { type: "zoomOut", minScale: number, maxScale: number }
|
||||||
|
|
||||||
private getItem(itemIdx: number) {
|
private getItem(itemIdx: number) {
|
||||||
let view = this.renderPage(itemIdx)
|
let view = this.renderPage(itemIdx)
|
||||||
|
Reference in New Issue
Block a user