Skip to content

Commit

Permalink
Merge pull request #2604 from cxfeng1/dev
Browse files Browse the repository at this point in the history
+ [doc]  Adding docs for 0.10.0 features.
  • Loading branch information
Jinjiang authored Feb 17, 2017
2 parents dd44ab5 + 54489e4 commit 1b79066
Show file tree
Hide file tree
Showing 3 changed files with 29 additions and 22 deletions.
36 changes: 19 additions & 17 deletions doc/source/references/advanced/extend-to-ios.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ version: 2.1
---

# Extend to iOS

### Module extend

Weex SDK provides only rendering capabilities, rather than have other capabilities, such as network, picture, and URL redirection. If you want these features, you need to implement it.
Expand All @@ -15,11 +15,11 @@ For example: If you want to implement an address jumping function, you can achie

#### Step to customize a module

1. Module
1. Module
customized must implement WXModuleProtocol
2. A macro named `WX_EXPORT_METHOD` must be added, as it is the only way to be recognized by Weex. It takes arguments that specifies the method in module called by JavaScript code.
2. A macro named `WX_EXPORT_METHOD` must be added, as it is the only way to export methods to JavaScript.
3. The weexInstance should be synthesized. Each module object is bind to a specific instance.
4. Module methods will be invoked in UI thread, so do not put time consuming operation there. If you want to execute the whole module methods in other thread, please implement the method `- (NSThread *)targetExecuteThread` in protocol. In the way, tasks distributed to this module will be executed in targetExecuteThread.
4. Module methods will be invoked in UI thread, so do not put time consuming operation there. If you want to execute the whole module methods in other thread, please implement the method `- (NSThread *)targetExecuteThread` in protocol. In the way, tasks distributed to this module will be executed in targetExecuteThread.
5. Weex params can be String or Map.
6. Module supports to return results to Javascript in callback. This callback is type of `WXModuleCallback`, the params of which can be String or Map.

Expand All @@ -46,7 +46,9 @@ For example: If you want to implement an address jumping function, you can achie

@end
```
In addition, `0.10.0` begins to support synchronous module API call, you can use macro `WX_EXPORT_METHOD_SYNC` to export module methods which could make JavaScript receive return values from native, it **can only be called on JS thread**.
#### Register the module
You can register the customized module by calling the method `registerModule:withClass` in WXSDKEngine.
Expand All @@ -62,7 +64,7 @@ WXSDKEngine.h
[WXSDKEngine registerModule:@"event" withClass:[WXEventModule class]];
```

### Handler extend

Weex SDK doesn't have capabilitis, such as image download 、navigator operation,please implement these protocols by yourself.
Expand Down Expand Up @@ -102,7 +104,7 @@ Implement above protocol as follows.
if ([url hasPrefix:@"//"]) {
url = [@"http:" stringByAppendingString:url];
}
return (id<WXImageOperationProtocol>)[[SDWebImageManager sharedManager] downloadImageWithURL:[NSURL URLWithString:url] options:0 progress:^(NSInteger receivedSize, NSInteger expectedSize) {
return (id<WXImageOperationProtocol>)[[SDWebImageManager sharedManager] downloadImageWithURL:[NSURL URLWithString:url] options:0 progress:^(NSInteger receivedSize, NSInteger expectedSize) {
} completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, BOOL finished, NSURL *imageURL) {
if (completedBlock) {
completedBlock(image, error, finished);
Expand All @@ -111,7 +113,7 @@ Implement above protocol as follows.
}
@end
```

#### Register the handler

You can register the handler which implements the protocol by calling `registerHandler:withProtocol` in WXSDKEngine.
Expand All @@ -124,10 +126,10 @@ WXSDKEngine.h
* @param protocol The protocol to confirm
*/
+ (void)registerHandler:(id)handler withProtocol:(Protocol *)protocol;

[WXSDKEngine registerHandler:[WXImgLoaderDefaultImpl new] withProtocol:@protocol(WXImgLoaderProtocol)];
```
## Custom Native Components for iOS
### Component extend
Expand Down Expand Up @@ -176,7 +178,7 @@ All of the styles, attributes and events will be passed to the component's initi
_imageSrc = [WXConvert NSString:attributes[@"src"]];
_resizeMode = [WXConvert UIViewContentMode:attributes[@"resize"]];
}

return self;
}

Expand All @@ -192,12 +194,12 @@ A Native Component has a life cycle managed by Weex. Weex creates it, layout it,
Weex offers component life cycle hooks that give you visibility into these key moments and the ability to act when they occur.
method| description
method| description
:----:|------
initWithRef:type:...| Initializes a new component using the specified properties.
initWithRef:type:...| Initializes a new component using the specified properties.
layoutDidFinish | Called when the component has just laid out.
loadView | Creates the view that the component manages.
viewWillLoad | Called before the load of component's view .
loadView | Creates the view that the component manages.
viewWillLoad | Called before the load of component's view .
viewDidLoad | Called after the component's view is loaded and set.
viewWillUnload | Called just before releasing the component's view.
viewDidUnload | Called when the component's view is released.
Expand Down Expand Up @@ -230,7 +232,7 @@ As an image component, we will need to fetch the remote image and set it to the
imageView.userInteractionEnabled = YES;
imageView.clipsToBounds = YES;
imageView.exclusiveTouch = YES;

// Do your image fetching and updating logic
}
```
Expand All @@ -245,7 +247,7 @@ If image's remote source can be changed, you can also hook the `updateAttributes
_imageSrc = [WXConvert NSString:attributes[@"src"]];
// Do your image updating logic
}

if (attributes[@"resize"]) {
_resizeMode = [WXConvert UIViewContentMode:attributes[@"resize"]];
self.view.contentMode = _resizeMode;
Expand Down
6 changes: 4 additions & 2 deletions doc/source/references/components/cell.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,19 +17,21 @@ This type of component supports all kinds of weex component as its child compone

### Attributes

There is no specific attribute for this component other than the [common attributes](../common-attrs.html).
**common attributes**: check out the [common attributes](../common-attrs.html).

**Notes:** you can't give `<cell>` a `flex` value. Width of `<cell>` is equal to the width of its parent component `<list>`, and you don't need to specify its height.

### Styles

**common styles**: check out the [common styles](../common-attrs.html)
**common styles**: check out the [common styles](../common-style.html)

- support flexbox related styles
- support box model related styles
- support ``position`` related styles
- support ``opacity``, ``background-color`` etc.

**Notes:** cell itself is a container, its layout info is managed by list, so specifying cell's margin info will not work.

### Events

**common events**: check out the [common events](../common-event.html)
Expand Down
9 changes: 6 additions & 3 deletions doc/source/references/gesture.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,9 @@ For now, there are four types of gestures:
* `panstart`
* `panmove`
* `panend`
* **Horizontal/Vertical Pan** <span class="api-version">v0.10+</span> . Mainly used for cell swipe gestures before conflict resolving system is completed. start/move/end state of the gesture will be passed by `state` property. **Note**: These gestures are in conflict with click event on Android currently.
* `horizontalpan`
* `verticalpan`
* **Swipe**. Swipe is fired when user swipe a touch point on the screen. A serial of motion will only trigger one Swipe gesture.
* **LongPress**. Swipe is fired when a touch point is held for 500 ms or more.

Expand All @@ -37,17 +40,17 @@ Users may choose their gesture according to their situation.
The following properties can be used in gesture callback:

* `direction`. Only exists for **Swipe** gesture. Indicate the direcion of the swipe, choose from `up`, `left`, `bottom`, `right`.
* `changedTouches`. An array of motion for every touch pointer that has contribute to the current gesture.
* `changedTouches`. An array of motion for every touch pointer that has contribute to the current gesture.

### changedTouches

`changedTouches` is an array, with the following properties in its children:

* `identifier`. A unique identifier for a touch pointer.
* `pageX`. The X coordinate of the touch pointer relative to the left edge of the document.
* `pageX`. The X coordinate of the touch pointer relative to the left edge of the document.
* `pageY`. The Y coordinate of the touch pointer relative to the top of the document.
* `screenX`. The X coordinate of the touch point relative to the left edge of the screen.
* `screenY`. The Y coordinate of the touch point relative to the top edge of the screen.

## Constrain
Currently, Weex Android do not support listening to gesture on `scroller`, `list` and `webview`, as it would lead a large amount of event conflicting.
Currently, Weex Android do not support listening to gesture on `scroller`, `list` and `webview`, as it would lead a large amount of event conflicting.

0 comments on commit 1b79066

Please sign in to comment.