Weex試食

21201 ワード

WeexはアリオープンソースのクラスReact Native技術であり、実際にはVue.js+React Native製のホイールを統合した(アリ無線フロントエンドが発表したWeexをどう見るか?)ということが知られている.Weexは軽量級のモバイル端末のプラットフォーム間ダイナミックテクノロジーソリューションであり、主にWeb方式を用いてNative性能のAppを開発することに力を入れている.Weexの学習コストはRNより相対的に低く、簡易版のHTML/CSS/JavaScriptとカスタマイズされたコンポーネントとルールを使用して.weファイルを開発し、インタフェースコントロールのレイアウト、スタイル、データバインド、簡単なイベントバインドなどを完了すると言える.Weexはnode.jsのユーティリティを提供し、.weファイルをjs bundleファイルに変換し、クライアントがweex sdkを導入するとjs bundleファイルを解析し、最終的にページレンダリングを完了します.次に簡単にweexを試してみます.
Weex構成
.weファイル開発は実際にはどのエディタでも可能ですが、.weファイルをweex sdkで識別および解析できるjs bundleファイルに変換するNodeを使用して、Weexが提供する.weファイル変換ツールをインストールする必要があります.
npm install -g weex-toolkit
主にAndroidエンドの構成を紹介します:1、まずweex sdkを導入して、gradleはweex依存を追加します
compile 'com.taobao.android:weex_sdk:0.5.1@aar'
2、ネットワーク権限が宣言されていることを確認する
<uses-permission android:name="android.permission.INTERNET" />
3、ImageViewのネットワークピクチャ形式weexを構成するには、手動でネットワークピクチャのロードを構成する必要があります.そうしないと、imageviewは正常に動作しません.通常、サードパーティ製のピクチャを使用してライブラリをロードすることができます.ここではPicassoを導入して、ネットワークピクチャのロードを支援します.構成タイミングは、アプリケーションの初期化に設定できます.これにより、グローバルに有効になります.
private void initWeex(){
    InitConfig.Builder configBuilder = new InitConfig.Builder().setImgAdapter(new IWXImgLoaderAdapter() {
        @Override
        public void setImage(String url, ImageView view, WXImageQuality quality, WXImageStrategy strategy) {
            Picasso.with(getApplicationContext()).load(url).into(view);
        }
    });
    WXSDKEngine.initialize(this, configBuilder.build());
}
以上の構成により,クライアントの基本的なweex環境も構成される.
.weファイル開発
.weファイルは主に3つの大部分を含み、