Rexseeに基づいてWeb開発方式でAndroidアプリケーションを作成する方法

3145 ワード
and roid モバイルweb開発 Rexsee
Rexseeは国内のオープンソースモバイルWeb開発プラットフォームである.Rexseeを使用してAndroidアプリケーションを開発するのは、Webサイトを作成するプロセスと変わりません.すべてのRexseeコードはWebフロントエンドにのみ表示され、HTMLページのラベルに表示されます.
 
Rexseeクライアントの作成は、実際にはRexseeが理解し、レンダリングできるHTML、CSS、Javascriptコードの作成です.Rexseeは、Webkitがサポートするすべてのオブジェクトに加えて、100以上のJavascriptオブジェクトと対応する2000のメソッドとイベントを拡張する「ブラウザ」として理解できます.
 
ローカル機能をサポートする呼び出しインタフェースは、ローカルストレージ、通信録、センサ、位置決め情報などのローカル機能の呼び出しを実現します.また,オフラインコミット,pushプッシュなどのオリジナルアプリケーション機能も提供されている.
 
  • インタフェース:RexseeのページデザインはWebレイアウトとオリジナルレイアウトの2つの形態をサポートしています.オリジナルレイアウトに対して、Javascript言語でAndroid SDKのレイアウトと基本オブジェクトを構築でき、対応するタッチスクリーンイベントと組み合わせて、良いユーザー体験ができます.2 Dと3 Dの描画機能をサポートしています.Webレイアウトには、ページ内オブジェクトとページ外オブジェクトの2つの異なるオブジェクトがあります.
  • ページ内のオブジェクトとは、表、DIVレイヤ、ピクチャ、キャンバスなどのページオブジェクトを指す.CSSでスタイルを制御することができ、そのレンダリング効果はWebkitエンジンが担当します.
  • ページ外オブジェクトとは、各種Bar、ダイアログボックス(Dialog)、ポップアップウィンドウなど、ページ外の要素を指す.オブジェクトの位置、幅、高さ、透明度、色、フォントなど、Rexseeのスタイルシート定義を使用します.ページ外要素のスタイルは、関連オブジェクトのスタイル設定方法によって操作されます.

  • 機能呼び出し:同期と非同期の2つの呼び出し方式を同時にサポートします.マルチメディアサポート、位置決め、位置サービス、センサ、ストレージ、Bluetooth、wifi、プッシュと通知などの機能を実現します.
  • インタラクション:Javascriptのイベントインタフェース、Rexseeのイベントインタフェース、およびRexseeプライベートプロトコルによって実現される.
  • は、特に、プライベートプロトコルが、例えばrexsee:infoを介して行われることを指摘する.rexsee:aboutなど;
  • RexseeのイベントインタフェースはすでにRexseeによって内蔵登録されており、使用時には対応するイベント関数にユーザーコードを記述するだけでよく、イベントがトリガーされるとユーザーコードが実行される.

  • デバッグ:既存のWebフロントエンドの開発と一致します.また、Rexsee自体には、エラーをキャプチャするための例外イベントも用意されています.
  • コンパイル:プロセス全体が、RexseeコードとRexseeクライアントを関連付けるプロセスです.
  • は、Rexseeコードが存在するURLとRexseeクライアントのトップページをバインドするだけで、B/Sアーキテクチャの下に実装できます.このアーキテクチャの下で、Rexseeコードは実際にはサーバ側に配置され、クライアントの体積は小さく、ダウンロード更新を必要とせずにアプリケーションのアップグレードを実現することができます.
  • はまた、C/Sアーキテクチャの下で、Rexseeコード、リソースファイルをRexseeクライアントにパッケージ化する必要がある.このアーキテクチャモデルは、元のアプリケーションとより類似しており、ネットワークの束縛から完全に脱し、起動と実行効率が高い.
  • 同時に、RexseeはB/C/Sハイブリッドアーキテクチャモデル、すなわちB/SとC/Sを統合する利点を提供した.


    • 開発者にとっては,Webフロントエンドの開発を把握した上で,Rexseeが提供するJavascriptオブジェクトをオンデマンドで選択するだけで,Rexseeオブジェクトの方法,イベント記述コードに従って対応する機能を実現できる.
     
    単純コードの例
    <html>
<head>
<title>这是一个android应用</tiltle>
<script type=text/javascript>
//Rexsee 代码从这里开始
window.onRexseeReady=function(){
 rexseeScreen.setScreenOrientation("portrait");  //设置屏幕方向
 rexseeTitleBar.setStyle('visibility:hidden;');  //标题栏样式  隐藏
 rexseeStatusBar.setStyle('visibility:hidden;');  //状态栏样式  隐藏
 rexseeDialog.toast('系统加载完毕！');    //出现后随即消失效果
}
</script>
</head>
</html>
     
    コードが书き终わった后にオンラインコンパイルを使ってAPKファイルを生成して、ダウンロードして端末にインストールします;オンラインコンパイルのトップページアドレスはプログラムのネットワークアドレスである.プリパッケージを使用して、プログラムのトップページアドレスをローカルに、ローカルアドレスをトップページアドレスとして使用することもできます.
     
    Rexseeコミュニティは開発マニュアルを提供しており、Rexseeオブジェクトの方法、イベント作成コードによって対応する機能を実現することができます.http://www.rexsee.com/rexsee/rexseeReference.apk
     
    コミュニティは現在もオンライン開発環境を提供しており、ローカル開発後にファイルをアップロードしてオンラインコンパイルし、最後にクライアントにカプセル化することもできます.
    Angular 2命令-汎用命令
    初期プローブopencv-ピクセルを操作する(ピクセル値の反転、ピクチャの混合)