iOS: slider add property slideStyle
This commit is contained in:
parent
c05c169dd7
commit
e1bb564d14
@ -8,16 +8,13 @@ const imageUrls = [
|
||||
'http://b.hiphotos.baidu.com/image/pic/item/0eb30f2442a7d9337119f7dba74bd11372f001e0.jpg',
|
||||
'http://a.hiphotos.baidu.com/image/h%3D300/sign=b38f3fc35b0fd9f9bf175369152cd42b/9a504fc2d5628535bdaac29e9aef76c6a6ef63c2.jpg',
|
||||
'http://h.hiphotos.baidu.com/image/pic/item/810a19d8bc3eb1354c94a704ac1ea8d3fd1f4439.jpg',
|
||||
'http://calonye.com/wp-content/uploads/2015/08/0-wx_fmtgiftpwebpwxfrom5wx_lazy1-9.gif',
|
||||
'http://hbimg.b0.upaiyun.com/ca29ea125b7f2d580f573e48eb594b1ef509757f34a08-m0hK45_fw658',
|
||||
'https://misc.aotu.io/ONE-SUNDAY/SteamEngine.png',
|
||||
'http://b.hiphotos.baidu.com/image/pic/item/908fa0ec08fa513db777cf78376d55fbb3fbd9b3.jpg',
|
||||
'http://f.hiphotos.baidu.com/image/pic/item/0e2442a7d933c8956c0e8eeadb1373f08202002a.jpg',
|
||||
'http://f.hiphotos.baidu.com/image/pic/item/b151f8198618367aa7f3cc7424738bd4b31ce525.jpg',
|
||||
'http://b.hiphotos.baidu.com/image/pic/item/0eb30f2442a7d9337119f7dba74bd11372f001e0.jpg',
|
||||
'http://a.hiphotos.baidu.com/image/h%3D300/sign=b38f3fc35b0fd9f9bf175369152cd42b/9a504fc2d5628535bdaac29e9aef76c6a6ef63c2.jpg',
|
||||
'http://h.hiphotos.baidu.com/image/pic/item/810a19d8bc3eb1354c94a704ac1ea8d3fd1f4439.jpg',
|
||||
'http://calonye.com/wp-content/uploads/2015/08/0-wx_fmtgiftpwebpwxfrom5wx_lazy1-9.gif',
|
||||
]
|
||||
@Entry
|
||||
class SliderPanel extends Panel {
|
||||
@ -28,7 +25,11 @@ class SliderPanel extends Panel {
|
||||
return slideItem(image({
|
||||
imageUrl: imageUrls[idx % imageUrls.length],
|
||||
scaleType: ScaleType.ScaleAspectFit,
|
||||
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST).configHeight(LayoutSpec.MOST).configAlignment(gravity().center()),
|
||||
layoutConfig: layoutConfig()
|
||||
.configWidth(LayoutSpec.MOST)
|
||||
.configHeight(LayoutSpec.MOST)
|
||||
.configAlignment(gravity().center())
|
||||
//.configMargin({ left: 30, right: 30, top: 30, bottom: 30 }),
|
||||
})).also(it => {
|
||||
let start = idx
|
||||
it.onClick = () => {
|
||||
@ -37,6 +38,7 @@ class SliderPanel extends Panel {
|
||||
})
|
||||
},
|
||||
loop: true,
|
||||
slideStyle: { type: "zoomOut", minScale: 0.1, maxScale: 1 },
|
||||
layoutConfig: {
|
||||
widthSpec: LayoutSpec.MOST,
|
||||
heightSpec: LayoutSpec.MOST,
|
||||
|
@ -43,6 +43,9 @@ @interface DoricSliderNode () <UICollectionViewDataSource, UICollectionViewDeleg
|
||||
@property(nonatomic, copy) NSString *renderPageFuncId;
|
||||
@property(nonatomic, copy) NSString *propRenderPageFuncId;
|
||||
@property(nonatomic, assign) BOOL needResetScroll;
|
||||
@property(nonatomic, strong) NSString *slideStyle;
|
||||
@property(nonatomic, assign) CGFloat minScale;
|
||||
@property(nonatomic, assign) CGFloat maxScale;
|
||||
@end
|
||||
|
||||
@interface DoricSliderView : UICollectionView
|
||||
@ -56,6 +59,8 @@ - (instancetype)initWithContext:(DoricContext *)doricContext {
|
||||
if (self = [super initWithContext:doricContext]) {
|
||||
_itemViewIds = [NSMutableDictionary new];
|
||||
_batchCount = 15;
|
||||
_minScale = .618f;
|
||||
_maxScale = 1.f;
|
||||
}
|
||||
return self;
|
||||
}
|
||||
@ -94,6 +99,14 @@ - (void)blendView:(UICollectionView *)view forPropName:(NSString *)name propValu
|
||||
self.propLoop = [prop boolValue];
|
||||
} else if ([@"bounces" isEqualToString:name]) {
|
||||
self.view.bounces = [prop boolValue];
|
||||
} else if ([@"slideStyle" isEqualToString:name]) {
|
||||
if ([prop isKindOfClass:NSDictionary.class]) {
|
||||
self.slideStyle = prop[@"type"];
|
||||
self.maxScale = [prop[@"maxScale"] floatValue];
|
||||
self.minScale = [prop[@"minScale"] floatValue];
|
||||
} else if ([prop isKindOfClass:NSString.class]) {
|
||||
self.slideStyle = prop;
|
||||
}
|
||||
} else {
|
||||
[super blendView:view forPropName:name propValue:prop];
|
||||
}
|
||||
@ -267,6 +280,19 @@ - (void)blendSubNode:(NSDictionary *)subModel {
|
||||
}];
|
||||
}
|
||||
|
||||
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
|
||||
if ([self.slideStyle isEqualToString:@"zoomOut"]) {
|
||||
CGFloat centerX = scrollView.width / 2.f;
|
||||
[self.view.visibleCells forEach:^(__kindof UICollectionViewCell *obj) {
|
||||
CGFloat vCenterX = obj.centerX - scrollView.contentOffset.x;
|
||||
CGFloat percent = ABS(vCenterX - centerX) / centerX;
|
||||
CGFloat scale = self.maxScale - (self.maxScale - self.minScale) * percent;
|
||||
obj.transform = CGAffineTransformScale(CGAffineTransformIdentity, scale, scale);
|
||||
obj.layer.anchorPoint = CGPointMake(0.5f, 0.5f);
|
||||
}];
|
||||
}
|
||||
}
|
||||
|
||||
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
|
||||
NSUInteger pageIndex = (NSUInteger) (scrollView.contentOffset.x / scrollView.width);
|
||||
scrollView.contentOffset = CGPointMake(pageIndex * scrollView.width, scrollView.contentOffset.y);
|
||||
|
4
doric-web/dist/index.js
vendored
4
doric-web/dist/index.js
vendored
@ -3670,8 +3670,8 @@ __decorate$9([
|
||||
], Slider.prototype, "bounces", void 0);
|
||||
__decorate$9([
|
||||
Property,
|
||||
__metadata$9("design:type", String)
|
||||
], Slider.prototype, "pageTransformer", void 0);
|
||||
__metadata$9("design:type", Object)
|
||||
], Slider.prototype, "slideStyle", void 0);
|
||||
function slider(config) {
|
||||
const ret = new Slider;
|
||||
ret.apply(config);
|
||||
|
Reference in New Issue
Block a user