Weexの環境構築とAndroid Studioと通過するピットへの統合

10037 ワード
概要
Weexは簡単で使いやすいプラットフォーム間開発案で、webの開発体験で高性能で拡張可能なnativeアプリケーションを構築することができ、それを実現するために、WeexはVueと協力し、Vueを上層フレームワークとして使用し、W 3 C標準に従って統一的なJSPengineとDOM APIを実現することができ、これにより、他のフレームワークを使用してWeexを駆動し、三端一致のnativeアプリケーションを構築することができる.
前期準備
JDK version>=1.7がインストールされ、環境変数が設定されています.Android SDKがインストールされ、環境変数が設定されています.Android SDK version 23 (compileSdkVersion in build.gradle)SDK build tools version 23.0.1 (buildToolsVersion in build.gradle)Android Support Repository >= 17 (for Android Support Library)
Android sdkをテストした開発クラスライブラリは23以上でなければなりませんが、高くも低くもありません.低バージョンのクラスライブラリでは、ページ機能のロードに失敗することがあります.
古いプロジェクトsdkが低すぎる場合はweexを使用し、sdkを提供しなければなりません.
Android統合の2つの方法
1.gradle依存統合
compile 'com.android.support:recyclerview-v7:23.1.1' compile 'com.android.support:support-v4:23.1.1' compile 'com.android.support:appcompat-v7:23.1.1' compile 'com.alibaba:fastjson:1.1.46.android'compile 'com.taobao.android:weex_sdk:0.5.1@aar'weexコアライブラリの他の関連バージョン番号は23を下回らないように統一したほうがいい.
実際にテストを経て、現在アリの公式サイトが発表しているこのバージョンのweexと公式のdemonには大きな問題があり、複雑なインタフェースはロードできません.バグであるはずです.
ローカルsdkの方法を適用せざるを得ません
2ローカルsdk統合
github倉庫アドレスhttps://github.com/apache/incubator-weexAndroidフォルダに統合されたsdk module
統合方法
SDK ModuleFile->New-Import Module->WEEX SDK Module(weex/android/sdk)->Finishappのbuildを以下の経路で導入する.gradleには、compile project(':weex_sdk')という依存性が追加されています.
統合後、buildのため、いくつかの問題が発生します.gradleにはいくつかのプロファイルがありません.私たちの開発とは関係ありません.ログアウトすればいいです.
     testCompile            ，                       ，         sdk
    ，   app

プロジェクトでの使用1は、まずグローバルボックスで初期化されます.
private void initWeex();//インタラクションはWXSDKEngineと言います.initialize(this, config);//初期化必須}catch(WXException){e.printStackTrace();}
}
2画面表示
表示されるインタフェースはActivityであり、AppCompatActivityを継承する必要があることに注意してください.そうしないと複雑なインタフェースが不完全に表示されます.
public class NetworkActivity extends AppCompatActivity implements IWXRenderListener {

	private static String weexurl = "http://192.168.1.55:8080/dist/hoteldetail.js";//   
	private WXSDKInstance mWXSDKInstance;
	private FrameLayout mContainer;
	private HotelModule mHotelModule;
	private NetworkActivity mContext;//   
	

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_network);
		mContext = this;
		CacheActivity.addActivity(NetworkActivity.this);
		mContainer = (FrameLayout) findViewById(R.id.container);
		hotelid = getIntent().getStringExtra("hotelid");
		hotelname = getIntent().getStringExtra("hotelname");
		
		HotelModule.setModuleListener(new HotelModule.ModuleListener() {
			@Override
			public void pickImage(int size) {
       
		});//    

		/**
		 * pageName:   ，      。
		 * url:  bundle JS     
		 * options:      WEEX   ，   bundle JS  
		 * flag:    。WXRenderStrategy.APPEND_ASYNC:         View，  View       onRenderSuccess。WXRenderStrategy.APPEND_ONCE               。
		 */
		mWXSDKInstance = new WXSDKInstance(this);
		mWXSDKInstance.registerRenderListener(this);
		Map options = new HashMap<>();
		options.put(WXSDKInstance.BUNDLE_URL, weexurl);//        options                  ，             
		options.put("hotelId", hotelid);
		options.put("hotelName", hotelname);
		mWXSDKInstance.renderByUrl("WXSample", weexurl, options, null, WXRenderStrategy.APPEND_ONCE);
	}

	@Override
	protected void onStart() {
		super.onStart();
		if (mWXSDKInstance != null) {
			mWXSDKInstance.onActivityStart();
		}
	}

	@Override
	protected void onResume() {
		super.onResume();
		if (mWXSDKInstance != null) {
			mWXSDKInstance.onActivityResume();
		}

		Log.e("hotel6", "weex  resume");
	}

	@Override
	protected void onPause() {
		super.onPause();
		if (mWXSDKInstance != null) {
			mWXSDKInstance.onActivityPause();
		}
	}

	@Override
	protected void onStop() {
		super.onStop();
		if (mWXSDKInstance != null) {
			mWXSDKInstance.onActivityStop();
		}
	}

	@Override
	protected void onDestroy() {
		super.onDestroy();
		if (mWXSDKInstance != null) {
			mWXSDKInstance.onActivityDestroy();
		}
	}

	@Override
	public void onViewCreated(WXSDKInstance instance, View view) {
		if (view.getParent() != null) {
			((ViewGroup) view.getParent()).removeView(view);
		}
		mContainer.addView(view);//         view，        
	}

	@Override
	public void onRenderSuccess(WXSDKInstance instance, int width, int height) {

	}

	@Override
	public void onRefreshSuccess(WXSDKInstance instance, int width, int height) {

	}

	@Override
	public void onException(WXSDKInstance instance, String errCode, String msg) {
	}
			
}

インタラクティブメソッド
Weexはローカルを呼び出し、細心の注意を払った読者はグローバルボックスに登録したときに1行あることに気づいた.
     WXSDKEngine.registerModule("hotelModule", HotelModule.class);  
               ，       ，      key   weex  ，      ，       
 
  
public class HotelModule extends WXModule {//      WXModule 


	private static ModuleListener mModuleListener;//                 activity

	public ModuleListener getModuleListener() {
		return mModuleListener;
	}

	public static void setModuleListener(ModuleListener moduleListener) {
		mModuleListener = moduleListener;
	}
	private View view;

	public View getView() {
		return view;
	}

	public void setView(View view) {
		this.view = view;
	}

	@JSMethod  //      ，    weex    ，weex      
	public void goBack() {

		CacheActivity.finishActivity();//       finish    ，                     ，
  
          ，      

	}

	@JSMethod
	public void getScreenWidth(JSCallback callback) {
		Map data = new HashMap<>();
		data.put("width", PageChangedManager.widthPixels);
		callback.invoke(data);//    hashmap   weex,key        
	}

	

	

	//      token
	@JSMethod
	public void GetAccessTokenApp(JSCallback callback) {
		Map data = new HashMap<>();
		data.put("access_token", Util.getNetHeader());
		callback.invoke(data);
	}

	
	@JSMethod
	public void getAppSystem(JSCallback callback) {
		Map data = new HashMap<>();
		data.put("system", "android");
		callback.invoke(data);
	}
	
	public interface ModuleListener {//weex      ，                     

		void pickImage(int size);

	}

}

  
weexをローカルで呼び出す方法
				String[] strings = new String[data.size()];
				data.toArray(strings);
				//      ，       
				Map params=new HashMap<>();
				params.put("images",strings);
				mWXSDKInstance.fireGlobalEventCallback("uploadImages",params);
  
アクティビティ管理クラス
public class CacheActivity {
	public static List activityList = new LinkedList();

	public CacheActivity() {

	}

	/**
	 *    Activity   
	 */
	public static void addActivity(Activity activity) {
		if (!activityList.contains(activity)) {
			activityList.add(activity);
		}
	}

	/**
	 *     Activigty finish
	 */
	public static void finishActivity() {
		for (Activity activity : activityList) {
			activity.finish();
		}
	}

	/**
	 *      Activity
	 */
	public static void finishSingleActivity(Activity activity) {
		if (activity != null) {
			if (activityList.contains(activity)) {
				activityList.remove(activity);
			}
			activity.finish();
			activity = null;
		}
	}

	/**
	 *        Activity                   ，             ，        。
	 */
	public static void finishSingleActivityByClass(Class> cls) {
		Activity tempActivity = null;
		for (Activity activity : activityList) {
			if (activity.getClass().equals(cls)) {
				tempActivity = activity;
			}
		}

		finishSingleActivity(tempActivity);
	}
}
  
基本的な使用はこれです.カスタムピクチャロードネットワークリクエストは公式ドキュメントとdemonを参照してください.他の詳細のバグは時間があります.
weex公式サイトアドレスhttp://weex.apache.org/cn/guide/integrate-to-your-app.html 
アリの成熟したプロジェクトの住所https://github.com/apache/incubator-weex/tree/master/android公式ドキュメントには簡単なdemonもあります.
統合ロジックを見ると、実際にはニーズを満たすことができない問題があります.
開発使用は現在、上記の推奨項目sdkを使用しています.
ndk配置公式サポートの2種類に注意しなければならないが、プロジェクトは他のアーキテクチャが一部の携帯電話に画像を表示しない問題が発生していることを発見し、現在は他の登録を抹消し、使用しているだけだ.
この2種類、weexはまだ完備しています.
        ndk {
            //       SO    ，    ，            `  `。
            abiFilters 'armeabi','x86'//
        }
NESTJSスケジュールされたジョブによる歩哨の統合
ついに!Generics💫