tianzixuan/Doric
Archived
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Merge branch 'feature/slider' into 'master'

Browse Source 
Feature/slider



See merge request !15
This commit is contained in:
pengfeizhou 2019-11-19 18:08:30 +08:00
commit 3093fe0923
27 changed files with 936 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
Android/doric/src/main/java/pub/doric/DoricRegistry.java
View File

@ -28,6 +28,8 @@ import pub.doric.shader.StackNode;
import pub.doric.shader.TextNode;
import pub.doric.shader.VLayoutNode;
import pub.doric.shader.ViewNode;
import pub.doric.shader.slider.SlideItemNode;
import pub.doric.shader.slider.SliderNode;
import pub.doric.utils.DoricMetaInfo;
import pub.doric.plugin.DoricJavaPlugin;
import pub.doric.plugin.ModalPlugin;
@ -72,6 +74,8 @@ public class DoricRegistry {
this.registerViewNode(ListNode.class);
this.registerViewNode(ListItemNode.class);
this.registerViewNode(ScrollerNode.class);
this.registerViewNode(SliderNode.class);
this.registerViewNode(SlideItemNode.class);
initRegistry(this);
}

29
Android/doric/src/main/java/pub/doric/shader/SuperNode.java
View File

@ -148,4 +148,33 @@ public abstract class SuperNode<V extends View> extends ViewNode<V> {
}
}
private boolean viewIdIsEqual(JSObject src, JSObject target) {
String srcId = src.asObject().getProperty("id").asString().value();
String targetId = target.asObject().getProperty("id").asString().value();
return srcId.equals(targetId);
}
protected void recursiveMixin(JSObject src, JSObject target) {
JSObject srcProps = src.getProperty("props").asObject();
JSObject targetProps = target.getProperty("props").asObject();
JSValue oriSubviews = targetProps.getProperty("subviews");
for (String key : srcProps.propertySet()) {
JSValue jsValue = srcProps.getProperty(key);
if ("subviews".equals(key) && jsValue.isArray()) {
JSValue[] subviews = jsValue.asArray().toArray();
for (JSValue subview : subviews) {
if (oriSubviews.isArray()) {
for (JSValue targetSubview : oriSubviews.asArray().toArray()) {
if (viewIdIsEqual(subview.asObject(), targetSubview.asObject())) {
recursiveMixin(subview.asObject(), targetSubview.asObject());
break;
}
}
}
}
continue;
}
targetProps.asObject().setProperty(key, jsValue);
}
}
}

2
Android/doric/src/main/java/pub/doric/shader/list/ListAdapter.java
View File

@ -37,7 +37,7 @@ import pub.doric.shader.ViewNode;
* @Author: pengfei.zhou
* @CreateDate: 2019-11-12
*/
public class ListAdapter extends RecyclerView.Adapter<ListAdapter.DoricViewHolder> {
class ListAdapter extends RecyclerView.Adapter<ListAdapter.DoricViewHolder> {
private final ListNode listNode;
String renderItemFuncId;

12
Android/doric/src/main/java/pub/doric/shader/list/ListNode.java
View File

@ -44,8 +44,18 @@ public class ListNode extends SuperNode<RecyclerView> {
@Override
protected void blendSubNode(JSObject subProperties) {
String viewId = subProperties.getProperty("id").asString().value();
ViewNode node = getSubNodeById(viewId);
if (node != null) {
node.blend(subProperties.getProperty("props").asObject());
} else {
JSObject oldModel = getSubModel(viewId);
if (oldModel != null) {
recursiveMixin(subProperties, oldModel);
}
listAdapter.blendSubNode(subProperties);
}
}
@Override
protected RecyclerView build() {
@ -81,7 +91,7 @@ public class ListNode extends SuperNode<RecyclerView> {
clearSubModel();
break;
case "batchCount":
this.listAdapter.batchCount = 15;
this.listAdapter.batchCount = prop.asNumber().toInt();
break;
default:
super.blend(view, name, prop);

136
Android/doric/src/main/java/pub/doric/shader/slider/SlideAdapter.java Normal file
View File

@ -0,0 +1,136 @@
/*
* Copyright [2019] [Doric.Pub]
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package pub.doric.shader.slider;
import android.text.TextUtils;
import android.util.SparseArray;
import android.view.View;
import android.view.ViewGroup;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
import com.github.pengfeizhou.jscore.JSArray;
import com.github.pengfeizhou.jscore.JSDecoder;
import com.github.pengfeizhou.jscore.JSNull;
import com.github.pengfeizhou.jscore.JSObject;
import com.github.pengfeizhou.jscore.JSValue;
import pub.doric.async.AsyncResult;
import pub.doric.shader.ViewNode;
/**
* @Description: com.github.penfeizhou.doric.widget
* @Author: pengfei.zhou
* @CreateDate: 2019-11-12
*/
class SlideAdapter extends RecyclerView.Adapter<SlideAdapter.DoricViewHolder> {
private final SliderNode sliderNode;
int itemCount = 0;
int batchCount = 3;
SparseArray<String> itemValues = new SparseArray<>();
SlideAdapter(SliderNode sliderNode) {
this.sliderNode = sliderNode;
}
@NonNull
@Override
public DoricViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
SlideItemNode node = (SlideItemNode) ViewNode.create(sliderNode.getDoricContext(), "SlideItem");
node.init(sliderNode);
return new DoricViewHolder(node, node.getDoricLayer());
}
@Override
public void onBindViewHolder(@NonNull DoricViewHolder holder, int position) {
JSValue jsValue = getItemModel(position);
if (jsValue.isObject()) {
JSObject jsObject = jsValue.asObject();
holder.slideItemNode.setId(jsObject.getProperty("id").asString().value());
holder.slideItemNode.blend(jsObject.getProperty("props").asObject());
}
}
@Override
public int getItemCount() {
return itemCount;
}
@Override
public int getItemViewType(int position) {
JSValue value = getItemModel(position);
if (value.isObject()) {
if (value.asObject().getProperty("identifier").isString()) {
return value.asObject().getProperty("identifier").asString().value().hashCode();
}
}
return super.getItemViewType(position);
}
private JSValue getItemModel(final int position) {
String id = itemValues.get(position);
if (TextUtils.isEmpty(id)) {
AsyncResult<JSDecoder> asyncResult = sliderNode.callJSResponse(
"renderBunchedItems",
position,
batchCount);
try {
JSDecoder jsDecoder = asyncResult.synchronous().get();
JSValue result = jsDecoder.decode();
if (result.isArray()) {
JSArray jsArray = result.asArray();
for (int i = 0; i < jsArray.size(); i++) {
JSObject itemModel = jsArray.get(i).asObject();
String itemId = itemModel.getProperty("id").asString().value();
itemValues.put(i + position, itemId);
sliderNode.setSubModel(itemId, itemModel);
}
return sliderNode.getSubModel(itemValues.get(position));
}
} catch (Exception e) {
e.printStackTrace();
}
return new JSNull();
} else {
JSObject childModel = sliderNode.getSubModel(id);
if (childModel == null) {
return new JSNull();
} else {
return childModel;
}
}
}
void blendSubNode(JSObject subProperties) {
for (int i = 0; i < itemValues.size(); i++) {
if (subProperties.getProperty("id").asString().value().equals(itemValues.valueAt(i))) {
notifyItemChanged(i);
}
}
}
static class DoricViewHolder extends RecyclerView.ViewHolder {
SlideItemNode slideItemNode;
DoricViewHolder(SlideItemNode node, @NonNull View itemView) {
super(itemView);
slideItemNode = node;
}
}
}

56
Android/doric/src/main/java/pub/doric/shader/slider/SlideItemNode.java Normal file
View File

@ -0,0 +1,56 @@
/*
* Copyright [2019] [Doric.Pub]
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package pub.doric.shader.slider;
import android.widget.FrameLayout;
import com.github.pengfeizhou.jscore.JSObject;
import com.github.pengfeizhou.jscore.JSValue;
import pub.doric.DoricContext;
import pub.doric.extension.bridge.DoricPlugin;
import pub.doric.shader.StackNode;
/**
* @Description: com.github.penfeizhou.doric.widget
* @Author: pengfei.zhou
* @CreateDate: 2019-11-12
*/
@DoricPlugin(name = "SlideItem")
public class SlideItemNode extends StackNode {
public String identifier = "";
public SlideItemNode(DoricContext doricContext) {
super(doricContext);
this.mReusable = true;
}
@Override
protected void blend(FrameLayout view, String name, JSValue prop) {
if ("identifier".equals(name)) {
this.identifier = prop.asString().value();
} else {
super.blend(view, name, prop);
}
}
@Override
public void blend(JSObject jsObject) {
super.blend(jsObject);
getDoricLayer().getLayoutParams().width = getLayoutParams().width;
getDoricLayer().getLayoutParams().height = getLayoutParams().height;
}
}

125
Android/doric/src/main/java/pub/doric/shader/slider/SliderNode.java Normal file
View File

@ -0,0 +1,125 @@
/*
* Copyright [2019] [Doric.Pub]
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package pub.doric.shader.slider;
import android.view.View;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.PagerSnapHelper;
import androidx.recyclerview.widget.RecyclerView;
import com.github.pengfeizhou.jscore.JSObject;
import com.github.pengfeizhou.jscore.JSValue;
import pub.doric.DoricContext;
import pub.doric.extension.bridge.DoricPlugin;
import pub.doric.shader.SuperNode;
import pub.doric.shader.ViewNode;
/**
* @Description: pub.doric.shader
* @Author: pengfei.zhou
* @CreateDate: 2019-11-19
*/
@DoricPlugin(name = "Slider")
public class SliderNode extends SuperNode<RecyclerView> {
private final SlideAdapter slideAdapter;
public SliderNode(DoricContext doricContext) {
super(doricContext);
this.slideAdapter = new SlideAdapter(this);
}
@Override
protected RecyclerView build() {
RecyclerView recyclerView = new RecyclerView(getContext());
LinearLayoutManager layoutManager = new LinearLayoutManager(getContext());
layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
recyclerView.setLayoutManager(layoutManager);
PagerSnapHelper mPagerSnapHelper = new PagerSnapHelper();
mPagerSnapHelper.attachToRecyclerView(recyclerView);
recyclerView.setAdapter(this.slideAdapter);
return recyclerView;
}
@Override
public ViewNode getSubNodeById(String id) {
RecyclerView.LayoutManager manager = mView.getLayoutManager();
if (manager == null) {
return null;
}
for (int i = 0; i < manager.getChildCount(); i++) {
View view = manager.getChildAt(i);
if (view == null) {
continue;
}
SlideAdapter.DoricViewHolder viewHolder = (SlideAdapter.DoricViewHolder) mView.getChildViewHolder(view);
if (id.equals(viewHolder.slideItemNode.getId())) {
return viewHolder.slideItemNode;
}
}
return null;
}
@Override
protected void blendSubNode(JSObject subProperties) {
String viewId = subProperties.getProperty("id").asString().value();
ViewNode node = getSubNodeById(viewId);
if (node != null) {
node.blend(subProperties.getProperty("props").asObject());
} else {
JSObject oldModel = getSubModel(viewId);
if (oldModel != null) {
recursiveMixin(subProperties, oldModel);
}
slideAdapter.blendSubNode(subProperties);
}
}
@Override
public void blend(JSObject jsObject) {
super.blend(jsObject);
if (mView != null) {
mView.post(new Runnable() {
@Override
public void run() {
slideAdapter.notifyDataSetChanged();
}
});
}
}
@Override
protected void blend(RecyclerView view, String name, JSValue prop) {
switch (name) {
case "itemCount":
this.slideAdapter.itemCount = prop.asNumber().toInt();
break;
case "renderItem":
// If reset renderItem,should reset native cache.
this.slideAdapter.itemValues.clear();
clearSubModel();
break;
case "batchCount":
this.slideAdapter.batchCount = prop.asNumber().toInt();
break;
default:
super.blend(view, name, prop);
break;
}
}
}

1
demo/index.ts
View File

@ -3,4 +3,5 @@ export default [
'src/Snake',
'src/ListDemo',
'src/ScrollerDemo',
'src/SliderDemo',
]

6
demo/src/ListDemo.ts
View File

@ -54,6 +54,12 @@ class ListPanel extends Panel {
textSize: 20,
height: 50,
bgColor: Color.parse('#00ffff'),
}).also(it => {
let start = 0
it.onClick = () => {
log(`clicked text:${start}`)
it.text = `${start++}`
}
}),
]).also(it => {
it.layoutConfig = {

60
demo/src/SliderDemo.ts Normal file
View File

@ -0,0 +1,60 @@
import { Group, Panel, List, text, gravity, Color, Stack, LayoutSpec, list, NativeCall, listItem, log, vlayout, Gravity, hlayout, slider, slideItem } from "doric";
const colors = [
"#f0932b",
"#eb4d4b",
"#6ab04c",
"#e056fd",
"#686de0",
"#30336b",
]
@Entry
class SliderPanel extends Panel {
build(rootView: Group): void {
rootView.addChild(vlayout([
text({
text: "SliderDemo",
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
},
textSize: 30,
textColor: Color.parse("#535c68"),
bgColor: Color.parse("#dff9fb"),
textAlignment: gravity().center(),
height: 50,
}),
slider({
itemCount: 100,
renderPage: (idx) => {
return slideItem(text({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
alignment: gravity().center(),
},
text: `Page At Line ${idx}`,
textAlignment: gravity().center(),
textColor: Color.parse("#ffffff"),
textSize: 20,
height: 300,
bgColor: Color.parse(colors[idx % colors.length]),
}).also(it => {
let start = idx
it.onClick = () => {
it.bgColor = Color.parse(colors[++start % colors.length])
}
}))
},
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.WRAP_CONTENT,
},
}),
]).also(it => {
it.layoutConfig = {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.AT_MOST,
}
}))
}
}

2
iOS/Pod/Classes/DoricDriver.h
View File

@ -52,6 +52,8 @@ NS_ASSUME_NONNULL_BEGIN
- (void)connectDevKit:(NSString *)url;
- (void)disconnectDevKit;
- (void)ensureSyncInMainQueue:(dispatch_block_t)block;
@end
NS_ASSUME_NONNULL_END

7
iOS/Pod/Classes/DoricDriver.m
View File

@ -183,4 +183,11 @@ - (void)disconnectDevKit {
}
}
- (void)ensureSyncInMainQueue:(dispatch_block_t)block {
if (strcmp(dispatch_queue_get_label(DISPATCH_CURRENT_QUEUE_LABEL), dispatch_queue_get_label(dispatch_get_main_queue())) == 0) {
block();
} else {
dispatch_async(dispatch_get_main_queue(), block);
}
}
@end

4
iOS/Pod/Classes/DoricRegistry.m
View File

@ -31,6 +31,8 @@
#import "DoricListNode.h"
#import "DoricListItemNode.h"
#import "DoricScrollerNode.h"
#import "DoricSliderNode.h"
#import "DoricSlideItemNode.h"
@interface DoricRegistry ()
@ -64,6 +66,8 @@ - (void)innerRegister {
[self registerViewNode:DoricListNode.class withName:@"List"];
[self registerViewNode:DoricListItemNode.class withName:@"ListItem"];
[self registerViewNode:DoricScrollerNode.class withName:@"Scroller"];
[self registerViewNode:DoricSliderNode.class withName:@"Slider"];
[self registerViewNode:DoricSlideItemNode.class withName:@"SlideItem"];
}
- (void)registerJSBundle:(NSString *)bundle withName:(NSString *)name {

31
iOS/Pod/Classes/Shader/DoricListNode.m
View File

@ -29,6 +29,23 @@ @interface DoricTableViewCell : UITableViewCell
@implementation DoricTableViewCell
@end
@interface DoricTableView : UITableView
@end
@implementation DoricTableView
- (CGSize)sizeThatFits:(CGSize)size {
if (self.subviews.count > 0) {
CGFloat width = size.width;
for (UIView *child in self.subviews) {
width = MAX(child.width, width);
}
return CGSizeMake(width, size.width);
}
return size;
}
@end
@interface DoricListNode () <UITableViewDataSource, UITableViewDelegate>
@property(nonatomic, strong) NSMutableDictionary <NSNumber *, NSString *> *itemViewIds;
@property(nonatomic, strong) NSMutableDictionary <NSNumber *, NSNumber *> *itemHeights;
@ -47,7 +64,7 @@ - (instancetype)initWithContext:(DoricContext *)doricContext {
}
- (UITableView *)build {
return [[UITableView new] also:^(UITableView *it) {
return [[DoricTableView new] also:^(UITableView *it) {
it.dataSource = self;
it.delegate = self;
it.separatorStyle = UITableViewCellSeparatorStyleNone;
@ -129,6 +146,13 @@ - (NSDictionary *)itemModelAt:(NSUInteger)position {
- (void)blendSubNode:(NSDictionary *)subModel {
NSString *viewId = subModel[@"id"];
DoricViewNode *viewNode = [self subNodeWithViewId:viewId];
if (viewNode) {
[viewNode blend:subModel[@"props"]];
} else {
NSMutableDictionary *model = [[self subModelOf:viewId] mutableCopy];
[self recursiveMixin:subModel to:model];
[self setSubModel:model in:viewId];
[self.itemViewIds enumerateKeysAndObjectsUsingBlock:^(NSNumber *_Nonnull key, NSString *_Nonnull obj, BOOL *_Nonnull stop) {
if ([viewId isEqualToString:obj]) {
*stop = YES;
@ -139,6 +163,7 @@ - (void)blendSubNode:(NSDictionary *)subModel {
}
}];
}
}
- (void)callItem:(NSUInteger)position height:(CGFloat)height {
NSNumber *old = self.itemHeights[@(position)];
@ -154,7 +179,7 @@ - (void)callItem:(NSUInteger)position height:(CGFloat)height {
- (DoricViewNode *)subNodeWithViewId:(NSString *)viewId {
__block DoricViewNode *ret = nil;
dispatch_sync(dispatch_get_main_queue(), ^{
[self.doricContext.driver ensureSyncInMainQueue:^{
for (UITableViewCell *tableViewCell in self.view.visibleCells) {
if ([tableViewCell isKindOfClass:[DoricTableViewCell class]]) {
DoricListItemNode *node = ((DoricTableViewCell *) tableViewCell).doricListItemNode;
@ -164,7 +189,7 @@ - (DoricViewNode *)subNodeWithViewId:(NSString *)viewId {
}
}
}
});
}];
return ret;
}

19
iOS/Pod/Classes/Shader/DoricScrollerNode.h
View File

@ -1,7 +1,24 @@
/*
* Copyright [2019] [Doric.Pub]
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
//
// DoricScrollerNode.h
// Doric
//
// Created by pengfei.zhou on 2019/11/19.
//
#import <Foundation/Foundation.h>
#import "DoricSuperNode.h"

19
iOS/Pod/Classes/Shader/DoricScrollerNode.m
View File

@ -1,7 +1,24 @@
/*
* Copyright [2019] [Doric.Pub]
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
//
// DoricScrollerNode.m
// Doric
//
// Created by pengfei.zhou on 2019/11/19.
//
#import "DoricScrollerNode.h"
#import "DoricExtensions.h"

26
iOS/Pod/Classes/Shader/DoricSlideItemNode.h Normal file
View File

@ -0,0 +1,26 @@
/*
* Copyright [2019] [Doric.Pub]
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
//
// DoricSlideItemNode.h
// Doric
//
// Created by pengfei.zhou on 2019/11/19.
//
#import <Foundation/Foundation.h>
#import "DoricStackNode.h"
@interface DoricSlideItemNode : DoricStackNode
@end

47
iOS/Pod/Classes/Shader/DoricSlideItemNode.m Normal file
View File

@ -0,0 +1,47 @@
/*
* Copyright [2019] [Doric.Pub]
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
//
// DoricSlideItemNode.m
// Doric
//
// Created by pengfei.zhou on 2019/11/19.
//
#import "DoricSlideItemNode.h"
@interface DoricSlideItemView : DoricStackView
@end
@implementation DoricSlideItemView
@end
@implementation DoricSlideItemNode
- (instancetype)initWithContext:(DoricContext *)doricContext {
if (self = [super initWithContext:doricContext]) {
self.reusable = YES;
}
return self;
}
- (void)initWithSuperNode:(DoricSuperNode *)superNode {
[super initWithSuperNode:superNode];
self.reusable = YES;
}
- (DoricStackView *)build {
return [DoricSlideItemView new];
}
@end

27
iOS/Pod/Classes/Shader/DoricSliderNode.h Normal file
View File

@ -0,0 +1,27 @@
/*
* Copyright [2019] [Doric.Pub]
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
//
// DoricSliderNode.h
// Doric
//
// Created by pengfei.zhou on 2019/11/19.
//
#import <Foundation/Foundation.h>
#import "DoricSuperNode.h"
@interface DoricSliderNode : DoricSuperNode<UICollectionView *>
@end

190
iOS/Pod/Classes/Shader/DoricSliderNode.m Normal file
View File

@ -0,0 +1,190 @@
/*
* Copyright [2019] [Doric.Pub]
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
//
// DoricSliderNode.m
// Doric
//
// Created by pengfei.zhou on 2019/11/19.
//
#import <JavaScriptCore/JavaScriptCore.h>
#import "DoricSliderNode.h"
#import "Doric.h"
#import "DoricSlideItemNode.h"
@interface DoricCollectionViewCell : UICollectionViewCell
@property(nonatomic, strong) DoricSlideItemNode *doricSlideItemNode;
@end
@implementation DoricCollectionViewCell
@end
@interface DoricSliderNode () <UICollectionViewDataSource, UICollectionViewDelegateFlowLayout>
@property(nonatomic, strong) NSMutableDictionary <NSNumber *, NSString *> *itemViewIds;
@property(nonatomic, assign) NSUInteger itemCount;
@property(nonatomic, assign) NSUInteger batchCount;
@end
@interface DoricCollectionView : UICollectionView
@end
@implementation DoricCollectionView
- (CGSize)sizeThatFits:(CGSize)size {
if (self.subviews.count > 0) {
CGFloat height = size.height;
for (UIView *child in self.subviews) {
height = MAX(child.height, height);
}
return CGSizeMake(height, size.height);
}
return size;
}
@end
@implementation DoricSliderNode
- (instancetype)initWithContext:(DoricContext *)doricContext {
if (self = [super initWithContext:doricContext]) {
_itemViewIds = [NSMutableDictionary new];
_batchCount = 15;
}
return self;
}
- (UICollectionView *)build {
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
[flowLayout setScrollDirection:UICollectionViewScrollDirectionHorizontal];
return [[[DoricCollectionView alloc] initWithFrame:CGRectZero
collectionViewLayout:flowLayout]
also:^(UICollectionView *it) {
it.backgroundColor = [UIColor whiteColor];
it.pagingEnabled = YES;
it.delegate = self;
it.dataSource = self;
[it registerClass:[DoricCollectionViewCell class] forCellWithReuseIdentifier:@"doricCell"];
}];
}
- (void)blendView:(UICollectionView *)view forPropName:(NSString *)name propValue:(id)prop {
if ([@"itemCount" isEqualToString:name]) {
self.itemCount = [prop unsignedIntegerValue];
} else if ([@"renderPage" isEqualToString:name]) {
[self.itemViewIds removeAllObjects];
[self clearSubModel];
} else if ([@"batchCount" isEqualToString:name]) {
self.batchCount = [prop unsignedIntegerValue];
} else {
[super blendView:view forPropName:name propValue:prop];
}
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
return self.itemCount;
}
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
return CGSizeMake(self.view.width, self.view.height);
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section {
return 0;
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section {
return 0;
}
- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
NSUInteger position = (NSUInteger) indexPath.row;
NSDictionary *model = [self itemModelAt:position];
NSDictionary *props = model[@"props"];
DoricCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"doricCell" forIndexPath:indexPath];
if (!cell.doricSlideItemNode) {
DoricSlideItemNode *slideItemNode = [[DoricSlideItemNode alloc] initWithContext:self.doricContext];
[slideItemNode initWithSuperNode:self];
cell.doricSlideItemNode = slideItemNode;
[cell.contentView addSubview:slideItemNode.view];
}
DoricSlideItemNode *node = cell.doricSlideItemNode;
node.viewId = model[@"id"];
[node blend:props];
[node.view setNeedsLayout];
return cell;
}
- (BOOL)collectionView:(UICollectionView *)collectionView shouldSelectItemAtIndexPath:(NSIndexPath *)indexPath {
return NO;
}
- (NSDictionary *)itemModelAt:(NSUInteger)position {
NSString *viewId = self.itemViewIds[@(position)];
if (viewId && viewId.length > 0) {
return [self subModelOf:viewId];
} else {
DoricAsyncResult *result = [self callJSResponse:@"renderBunchedItems", @(position), @(self.batchCount), nil];
JSValue *models = [result waitUntilResult];
NSArray *array = [models toArray];
[array enumerateObjectsUsingBlock:^(NSDictionary *obj, NSUInteger idx, BOOL *stop) {
NSString *thisViewId = obj[@"id"];
[self setSubModel:obj in:thisViewId];
NSUInteger pos = position + idx;
self.itemViewIds[@(pos)] = thisViewId;
}];
return array[0];
}
}
- (DoricViewNode *)subNodeWithViewId:(NSString *)viewId {
__block DoricViewNode *ret = nil;
[self.doricContext.driver ensureSyncInMainQueue:^{
for (UICollectionViewCell *collectionViewCell in self.view.visibleCells) {
if ([collectionViewCell isKindOfClass:[DoricCollectionViewCell class]]) {
DoricSlideItemNode *node = ((DoricCollectionViewCell *) collectionViewCell).doricSlideItemNode;
if ([viewId isEqualToString:node.viewId]) {
ret = node;
break;
}
}
}
}];
return ret;
}
- (void)blendSubNode:(NSDictionary *)subModel {
NSString *viewId = subModel[@"id"];
DoricViewNode *viewNode = [self subNodeWithViewId:viewId];
if (viewNode) {
[viewNode blend:subModel[@"props"]];
} else {
NSMutableDictionary *model = [[self subModelOf:viewId] mutableCopy];
[self recursiveMixin:subModel to:model];
[self setSubModel:model in:viewId];
[self.itemViewIds enumerateKeysAndObjectsUsingBlock:^(NSNumber *_Nonnull key, NSString *_Nonnull obj, BOOL *_Nonnull stop) {
if ([viewId isEqualToString:obj]) {
*stop = YES;
NSIndexPath *indexPath = [NSIndexPath indexPathForRow:[key integerValue] inSection:0];
[UIView performWithoutAnimation:^{
[self.view reloadItemsAtIndexPaths:@[indexPath]];
}];
}
}];
}
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
NSUInteger pageIndex = (NSUInteger) (scrollView.contentOffset.x / scrollView.width);
scrollView.contentOffset = CGPointMake(pageIndex * scrollView.width, scrollView.contentOffset.y);
}
@end

2
iOS/Pod/Classes/Shader/DoricSuperNode.h
View File

@ -36,4 +36,6 @@
- (void)clearSubModel;
- (DoricViewNode *)subNodeWithViewId:(NSString *)viewId;
- (void)recursiveMixin:(NSDictionary *)srcModel to:(NSMutableDictionary *)targetModel;
@end

30
iOS/Pod/Classes/Shader/DoricSuperNode.m
View File

@ -65,6 +65,36 @@ - (void)mixin:(NSDictionary *)srcModel to:(NSMutableDictionary *)targetModel {
targetModel[@"props"] = [targetProp copy];
}
- (void)recursiveMixin:(NSDictionary *)srcModel to:(NSMutableDictionary *)targetModel {
NSDictionary *srcProp = srcModel[@"props"];
NSMutableDictionary *targetProp = [targetModel[@"props"] mutableCopy];
NSArray *targetOri = targetProp[@"subviews"];
[srcProp enumerateKeysAndObjectsUsingBlock:^(NSString *key, id obj, BOOL *stop) {
if ([@"subviews" isEqualToString:key]) {
NSArray *subviews = obj;
NSMutableArray *targetSubviews = [targetOri mutableCopy];
if (subviews) {
for (NSDictionary *subview in subviews) {
NSString *viewId = subview[@"id"];
[targetSubviews enumerateObjectsUsingBlock:^(NSDictionary *obj, NSUInteger idx, BOOL *stop) {
if ([viewId isEqualToString:obj[@"id"]]) {
NSMutableDictionary *mutableDictionary = [obj mutableCopy];
[self recursiveMixin:subview to:mutableDictionary];
targetSubviews[idx] = [mutableDictionary copy];
*stop = YES;
}
}];
}
targetProp[@"subviews"] = [targetSubviews copy];
}
} else {
targetProp[key] = obj;
}
}];
targetModel[@"props"] = [targetProp copy];
}
- (void)blendSubNode:(DoricViewNode *)subNode layoutConfig:(NSDictionary *)layoutConfig {
DoricLayoutConfig *params = subNode.layoutConfig;

3
js-framework/index.ts
View File

@ -15,7 +15,8 @@
*/
export * from "./src/ui/view"
export * from "./src/ui/layout"
export * from "./src/ui/listview"
export * from "./src/ui/list"
export * from "./src/ui/slider"
export * from "./src/ui/scroller"
export * from "./src/ui/widgets"
export * from "./src/ui/panel"

11
js-framework/src/ui/declarative.ts
View File

@ -16,7 +16,8 @@
import { View, LayoutSpec } from './view'
import { Stack, HLayout, VLayout } from './layout'
import { IText, IImage, Text, Image } from './widgets'
import { IList, List } from './listview'
import { IList, List } from './list'
import { ISlider, Slider } from './slider'
export function text(config: IText) {
const ret = new Text
@ -85,3 +86,11 @@ export function list(config: IList) {
}
return ret
}
export function slider(config: ISlider) {
const ret = new Slider
for (let key in config) {
Reflect.set(ret, key, Reflect.get(config, key, config), ret)
}
return ret
}

0
js-framework/src/ui/listview.ts → js-framework/src/ui/list.ts
View File

72
js-framework/src/ui/slider.ts Normal file
View File

@ -0,0 +1,72 @@
import { Superview, View, LayoutSpec, Property, IView } from "./view";
import { Stack } from "./layout";
export function slideItem(item: View) {
return (new SlideItem).also((it) => {
it.layoutConfig = {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.WRAP_CONTENT,
}
it.addChild(item)
})
}
export class SlideItem extends Stack {
/**
* Set to reuse native view
*/
@Property
identifier?: string
}
export interface ISlider extends IView {
renderPage: (index: number) => SlideItem
itemCount: number
batchCount?: number
}
export class Slider extends Superview implements ISlider {
private cachedViews: Map<string, SlideItem> = new Map
private ignoreDirtyCallOnce = false
allSubviews() {
return this.cachedViews.values()
}
@Property
itemCount = 0
@Property
renderPage!: (index: number) => SlideItem
@Property
batchCount = 3
private getItem(itemIdx: number) {
let view = this.cachedViews.get(`${itemIdx}`)
if (view === undefined) {
view = this.renderPage(itemIdx)
view.superview = this
this.cachedViews.set(`${itemIdx}`, view)
}
return view
}
isDirty() {
if (this.ignoreDirtyCallOnce) {
this.ignoreDirtyCallOnce = false
//Ignore the dirty call once.
return false
}
return super.isDirty()
}
private renderBunchedItems(start: number, length: number) {
this.ignoreDirtyCallOnce = true;
return new Array(Math.min(length, this.itemCount - start)).fill(0).map((_, idx) => {
const slideItem = this.getItem(start + idx)
return slideItem.toModel()
})
}
}

13
js-framework/src/util/color.ts
View File

@ -19,8 +19,19 @@ import { Modeling } from "./types";
* Store color as format AARRGGBB or RRGGBB
*/
export class Color implements Modeling {
static BLACK = new Color(0xFF000000)
static DKGRAY = new Color(0xFF444444)
static GRAY = new Color(0xFF888888)
static LTGRAY = new Color(0xFFCCCCCC)
static WHITE = new Color(0xFFFFFFFF)
static RED = new Color(0xFFFF0000)
static GREEN = new Color(0xFF00FF00)
static BLUE = new Color(0xFF0000FF)
static YELLOW = new Color(0xFFFFFF00)
static CYAN = new Color(0xFF00FFFF)
static MAGENTA = new Color(0xFFFF00FF)
static TRANSPARENT = new Color(0)
_value: number = 0
constructor(v: number) {