Repository: incubator-weex Updated Branches: refs/heads/dev 703cc9907 -> 855f69bbb
+ [doc] add doc for iconfont Project: http://git-wip-us.apache.org/repos/asf/incubator-weex/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-weex/commit/1360b253 Tree: http://git-wip-us.apache.org/repos/asf/incubator-weex/tree/1360b253 Diff: http://git-wip-us.apache.org/repos/asf/incubator-weex/diff/1360b253 Branch: refs/heads/dev Commit: 1360b253409f6165cba9918f9de91a383a65707a Parents: 13fcb64 Author: acton393 <zhangxing610...@gmail.com> Authored: Tue May 16 17:33:16 2017 +0800 Committer: acton393 <zhangxing610...@gmail.com> Committed: Tue May 16 17:33:16 2017 +0800 ---------------------------------------------------------------------- doc/source/cn/references/components/text.md | 31 +++++++++++++++++++++ doc/source/cn/references/modules/dom.md | 19 +++++++++++++ doc/source/references/components/text.md | 35 +++++++++++++++++++++++- doc/source/references/modules/dom.md | 19 +++++++++++++ 4 files changed, 103 insertions(+), 1 deletion(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/1360b253/doc/source/cn/references/components/text.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/components/text.md b/doc/source/cn/references/components/text.md index ac43eea..2c13562 100644 --- a/doc/source/cn/references/components/text.md +++ b/doc/source/cn/references/components/text.md @@ -99,3 +99,34 @@ version: 2.1 ``` [try it](http://dotwe.org/vue/154e20171d350a081fba7878c53cf7d2) + +## iconfont +<sup class="wx-v">0.12.0</sup> +1. æ¯ættfåwoffåä½æ ¼å¼çèªå®ä¹åä½, å¯ä»¥éè¿è°ç¨`dom` module éé¢ç [addRule](../modules/dom.html#addRule)æ¹æ³, æ建èªå®ä¹ç`font-family`ä½¿ç¨ + +``` +<template> + <div style='flex-direction:row;margin-top:50px'> + <text style='font-family:iconfont4;font-size:50;color:green'></text> + <text style='font-family:iconfont4;font-size:50;'></text> + <text style='font-family:iconfont4;font-size:60;color:blue'></text> + <text style='font-family:iconfont4;font-size:60;color:green'></text> + </div> +</template> +<script> + module.exports = { + created: function() { + + var domModule = weex.requireModule('dom'); + //ç®åæ¯ættfãwoffæ件ï¼ä¸æ¯æsvgãeotç±»å,moreItem at http://www.iconfont.cn/ + + domModule.addRule('fontFace', { + 'fontFamily': "iconfont2", + 'src': "url('http://at.alicdn.com/t/font_1469606063_76593.ttf')" + }); + } +} +</script> +``` + +[try it](http://dotwe.org/vue/d96b6f89aadd1d628111c16a30e80482) http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/1360b253/doc/source/cn/references/modules/dom.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/dom.md b/doc/source/cn/references/modules/dom.md index c9586f0..ba05751 100644 --- a/doc/source/cn/references/modules/dom.md +++ b/doc/source/cn/references/modules/dom.md @@ -256,6 +256,25 @@ version: 2.1 [try it](http://dotwe.org/vue/d069a9bf0f0781b914f12a9a7b9a1447) + +###addRule +<sup class="wx-v">0.12.0</sup> + +addRuleæ¯å¯ä»¥ä¸ºdom æ·»å ä¸æ¡è§åï¼ç®åæ¯æèªå®ä¹åä½fontFaceè§åï¼æ建èªå®ä¹çfont-familyï¼å¯ä»¥å¨[text](../components/text.html#iconfont) + +####fontFace + +``` +var domModule = weex.requireModule('dom'); +domModule.addRule('fontFace', { + 'fontFamily': "iconfont2", + 'src': "url('http://at.alicdn.com/t/font_1469606063_76593.ttf')" +}); + +``` + +[try it](http://dotwe.org/vue/d96b6f89aadd1d628111c16a30e80482) + ## å ¶ä» dom è¿æä¸äºåºå±æ¥å£ç¨äºå建 Weex å®ä¾æ¶è°ç¨ï¼æ¯å¦ `createBody`ã`updateAttrs` çï¼ä½å¹¶æªå¼æ¾ä¾å¤é¨ä½¿ç¨ã http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/1360b253/doc/source/references/components/text.md ---------------------------------------------------------------------- diff --git a/doc/source/references/components/text.md b/doc/source/references/components/text.md index cfed19b..d6fa753 100644 --- a/doc/source/references/components/text.md +++ b/doc/source/references/components/text.md @@ -95,4 +95,37 @@ check out [common events](../common-event.html) </style> ``` -[try it](http://dotwe.org/vue/154e20171d350a081fba7878c53cf7d2) \ No newline at end of file +[try it](http://dotwe.org/vue/154e20171d350a081fba7878c53cf7d2) + +##iconfont +<sup class="wx-v">0.12.0</sup> + +1. support `ttf` and `woff` font format to custom your text, call [addRule](../modules/dom.html#addRule) in dom module to build your own `font-family` + + +``` +<template> + <div style='flex-direction:row;margin-top:50px'> + <text style='font-family:iconfont4;font-size:50;color:green'></text> + <text style='font-family:iconfont4;font-size:50;'></text> + <text style='font-family:iconfont4;font-size:60;color:blue'></text> + <text style='font-family:iconfont4;font-size:60;color:green'></text> + </div> +</template> +<script> + module.exports = { + created: function() { + + var domModule = weex.requireModule('dom'); + //ç®åæ¯ættfãwoffæ件ï¼ä¸æ¯æsvgãeotç±»å,moreItem at http://www.iconfont.cn/ + + domModule.addRule('fontFace', { + 'fontFamily': "iconfont2", + 'src': "url('http://at.alicdn.com/t/font_1469606063_76593.ttf')" + }); + } +} +</script> +``` + +[try it](http://dotwe.org/vue/d96b6f89aadd1d628111c16a30e80482) \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/1360b253/doc/source/references/modules/dom.md ---------------------------------------------------------------------- diff --git a/doc/source/references/modules/dom.md b/doc/source/references/modules/dom.md index 3fcee70..23dd7cd 100644 --- a/doc/source/references/modules/dom.md +++ b/doc/source/references/modules/dom.md @@ -255,3 +255,22 @@ Example Useage: [try it](http://dotwe.org/vue/87d4ed571de129ab28052b06a5d65fc8) + +###addRule +<sup class="wx-v">0.12.0</sup> + +you can add your rule for dom by this, now we support `fontFace` only for building your custom `font-family`, use it on [text](../components/text.html#iconfont) directly. + +####fontFace + +``` +var domModule = weex.requireModule('dom'); +domModule.addRule('fontFace', { + 'fontFamily': "iconfont2", + 'src': "url('http://at.alicdn.com/t/font_1469606063_76593.ttf')" +}); + +``` +[try it](http://dotwe.org/vue/d96b6f89aadd1d628111c16a30e80482) + +