SlideShare une entreprise Scribd logo
1  sur  22
Télécharger pour lire hors ligne
Javascript Java
Java/XML = Android

• Java
• Android   Subclassing

• XML
Java

•      2.2         JIT


• Eclipse
• met/src/cc/miankong/julia/...
             cd ../../../ “       ”
Javascript
•
•
•         GUI

•
•   Chrome

•      Julia
Android

• ViewGroup             View?

• Subclassing
 • Smalltalk         subclassing

 • iOS          subclassing
Android
setPositiveButton(
   android.R.string.ok,
   new AlertDialog.onClickListener() {
     public void onClick(
     DialogInterface d, int which) {
         ...
     }
})
     onClickListener                Java
Julia
                 Controller

touched: function(what) {
    if (what === “1”) {
    // ok
    }
    // cancel
}
XML

               XML
<?xml version=”1.0” encoding=”utf-8”?>
<shape xmlns:android=”http://schemas.android.com/apk/res/android”
android:shape=”rectangle”>
    <gradient
         android:startColor=”#414141”
         android:centerColor=”#202020”
         android:endColor=”#080808”
         android:angle=”270”
    />
</shape>
Julia

HTML5/CSS3         View
  <div class=”btn” data-touchable=”takePicture”>

    <label class=”cam-gradient”></label>

  </div>
Android ListView

• Adapter
•               ListView
Model + Template
  <ul class="table">
! ! {% for(var i=0; i < x.length; i++) { %}
! ! <li data-touchable="pushProfileView"
! ! ! data-user="{{ x[i].gid }}:{{ x[i].screenName }}">
! ! ! {% if (x[i].profileImageUrl) { %}
! ! ! ! <img src="{{ x[i].profileImageUrl }}">
! ! ! {% } %}
! ! ! <div><label>{{ x[i].screenName }}</label></div>
! ! ! <span class="more"></span>
! ! </li>
! ! {% } %}
</ul>
Model + Template


    JSP          Model
View
RESTful                  Model
      URL +            Converter
  refresh : function(postId, apiUrl) {
! ! var url = apiUrl
         || (appNamespace.HOST + "/api/met/get"),
! ! !    data = {id: postId};
! ! this.oauthREST(url, data, function(self, response) {
! ! ! self.patch(response);
! ! ! self.set({x: response});
! ! }, null);
! }
Julia MVC

•   HTML5/CSS3      View

•   REST   Model

•   JSP      Template

•   Delegation
Julia SQLite
  jsi.sqlInsert(
    "keyvalue",
    {
        key:
appNamespace.SNAP_HINT_DISPLAYED_KEY,
        value: "1"
    },
    function(lastRow){});
Julia SQLite

•                Table

•
•     HTML5   Web Worker   Web
    Storage
Julia
• JS
                   Julia


•          Template

•           DOM            Webkit
    Reflow/Layout

•      CSS3
Julia

                 DOM
NavigationView
View              View
       DIV
•                       Python/Ruby/
    Apache HttpClient

•
•
•
Julia


API   JS




      http://www.miankong.cc/julia/

Contenu connexe

Tendances

GREASEMONKEY
GREASEMONKEYGREASEMONKEY
GREASEMONKEYB4LT
 
Bootcamp Google Abidjan 2012: Workshop Gaou Search
Bootcamp Google Abidjan 2012: Workshop Gaou SearchBootcamp Google Abidjan 2012: Workshop Gaou Search
Bootcamp Google Abidjan 2012: Workshop Gaou SearchIsmael Toé
 
もっと使いやすくなる a-blog cms の更新方法カスタマイズ
もっと使いやすくなる a-blog cms の更新方法カスタマイズもっと使いやすくなる a-blog cms の更新方法カスタマイズ
もっと使いやすくなる a-blog cms の更新方法カスタマイズKasumi Morita
 
Evoluindo a arquitetura de uma aplicação com AngularJS
Evoluindo a arquitetura de uma aplicação com AngularJSEvoluindo a arquitetura de uma aplicação com AngularJS
Evoluindo a arquitetura de uma aplicação com AngularJSRodrigo Branas
 
ສ້າງລະບົບ Loin ດ້ວຍ php
ສ້າງລະບົບ Loin ດ້ວຍ phpສ້າງລະບົບ Loin ດ້ວຍ php
ສ້າງລະບົບ Loin ດ້ວຍ phpBounsong Byv
 
Jquery Preparation
Jquery PreparationJquery Preparation
Jquery Preparationumesh patil
 

Tendances (7)

GREASEMONKEY
GREASEMONKEYGREASEMONKEY
GREASEMONKEY
 
Asp .net Jquery
Asp .net JqueryAsp .net Jquery
Asp .net Jquery
 
Bootcamp Google Abidjan 2012: Workshop Gaou Search
Bootcamp Google Abidjan 2012: Workshop Gaou SearchBootcamp Google Abidjan 2012: Workshop Gaou Search
Bootcamp Google Abidjan 2012: Workshop Gaou Search
 
もっと使いやすくなる a-blog cms の更新方法カスタマイズ
もっと使いやすくなる a-blog cms の更新方法カスタマイズもっと使いやすくなる a-blog cms の更新方法カスタマイズ
もっと使いやすくなる a-blog cms の更新方法カスタマイズ
 
Evoluindo a arquitetura de uma aplicação com AngularJS
Evoluindo a arquitetura de uma aplicação com AngularJSEvoluindo a arquitetura de uma aplicação com AngularJS
Evoluindo a arquitetura de uma aplicação com AngularJS
 
ສ້າງລະບົບ Loin ດ້ວຍ php
ສ້າງລະບົບ Loin ດ້ວຍ phpສ້າງລະບົບ Loin ດ້ວຍ php
ສ້າງລະບົບ Loin ດ້ວຍ php
 
Jquery Preparation
Jquery PreparationJquery Preparation
Jquery Preparation
 

En vedette

桃太郎
桃太郎桃太郎
桃太郎montezu
 
18 一公斤电子,技术有机化与每个人板凳上的电子实验室 jiang chengyu
18 一公斤电子,技术有机化与每个人板凳上的电子实验室 jiang chengyu 18 一公斤电子,技术有机化与每个人板凳上的电子实验室 jiang chengyu
18 一公斤电子,技术有机化与每个人板凳上的电子实验室 jiang chengyu OpenSourceWeek
 
桃太郎
桃太郎桃太郎
桃太郎montezu
 
桃太郎プレゼン資料
桃太郎プレゼン資料桃太郎プレゼン資料
桃太郎プレゼン資料touyoko5050
 
桃太郎プレゼン資料
桃太郎プレゼン資料桃太郎プレゼン資料
桃太郎プレゼン資料touyoko5050
 
04 创客空间,玩出来的新经济 - 王盛林
04 创客空间,玩出来的新经济  - 王盛林04 创客空间,玩出来的新经济  - 王盛林
04 创客空间,玩出来的新经济 - 王盛林OpenSourceWeek
 

En vedette (9)

桃太郎
桃太郎桃太郎
桃太郎
 
Sarang ppt
Sarang pptSarang ppt
Sarang ppt
 
18 一公斤电子,技术有机化与每个人板凳上的电子实验室 jiang chengyu
18 一公斤电子,技术有机化与每个人板凳上的电子实验室 jiang chengyu 18 一公斤电子,技术有机化与每个人板凳上的电子实验室 jiang chengyu
18 一公斤电子,技术有机化与每个人板凳上的电子实验室 jiang chengyu
 
桃太郎
桃太郎桃太郎
桃太郎
 
Ciências e Educação
Ciências e EducaçãoCiências e Educação
Ciências e Educação
 
MillionAgents platform
MillionAgents platformMillionAgents platform
MillionAgents platform
 
桃太郎プレゼン資料
桃太郎プレゼン資料桃太郎プレゼン資料
桃太郎プレゼン資料
 
桃太郎プレゼン資料
桃太郎プレゼン資料桃太郎プレゼン資料
桃太郎プレゼン資料
 
04 创客空间,玩出来的新经济 - 王盛林
04 创客空间,玩出来的新经济  - 王盛林04 创客空间,玩出来的新经济  - 王盛林
04 创客空间,玩出来的新经济 - 王盛林
 

Plus de OpenSourceWeek

07 开源硬件与digilent - 王庭晖
07 开源硬件与digilent  - 王庭晖07 开源硬件与digilent  - 王庭晖
07 开源硬件与digilent - 王庭晖OpenSourceWeek
 
17 intro open-board-翟开源
17 intro open-board-翟开源17 intro open-board-翟开源
17 intro open-board-翟开源OpenSourceWeek
 
11 开源式合作与社会化创新 gao lei
11 开源式合作与社会化创新 gao lei11 开源式合作与社会化创新 gao lei
11 开源式合作与社会化创新 gao leiOpenSourceWeek
 
07 make sense-cosw- larry chiou
07  make sense-cosw- larry chiou07  make sense-cosw- larry chiou
07 make sense-cosw- larry chiouOpenSourceWeek
 
03 开源和山寨 新一代的开放创新方式-李大维
03 开源和山寨 新一代的开放创新方式-李大维03 开源和山寨 新一代的开放创新方式-李大维
03 开源和山寨 新一代的开放创新方式-李大维OpenSourceWeek
 
16 开源机器 zhang hao
16 开源机器 zhang hao16 开源机器 zhang hao
16 开源机器 zhang haoOpenSourceWeek
 

Plus de OpenSourceWeek (6)

07 开源硬件与digilent - 王庭晖
07 开源硬件与digilent  - 王庭晖07 开源硬件与digilent  - 王庭晖
07 开源硬件与digilent - 王庭晖
 
17 intro open-board-翟开源
17 intro open-board-翟开源17 intro open-board-翟开源
17 intro open-board-翟开源
 
11 开源式合作与社会化创新 gao lei
11 开源式合作与社会化创新 gao lei11 开源式合作与社会化创新 gao lei
11 开源式合作与社会化创新 gao lei
 
07 make sense-cosw- larry chiou
07  make sense-cosw- larry chiou07  make sense-cosw- larry chiou
07 make sense-cosw- larry chiou
 
03 开源和山寨 新一代的开放创新方式-李大维
03 开源和山寨 新一代的开放创新方式-李大维03 开源和山寨 新一代的开放创新方式-李大维
03 开源和山寨 新一代的开放创新方式-李大维
 
16 开源机器 zhang hao
16 开源机器 zhang hao16 开源机器 zhang hao
16 开源机器 zhang hao
 

09 julia 开源移动开发框架

  • 2. Java/XML = Android • Java • Android Subclassing • XML
  • 3. Java • 2.2 JIT • Eclipse • met/src/cc/miankong/julia/... cd ../../../ “ ”
  • 4. Javascript • • • GUI • • Chrome • Julia
  • 5. Android • ViewGroup View? • Subclassing • Smalltalk subclassing • iOS subclassing
  • 6. Android setPositiveButton( android.R.string.ok, new AlertDialog.onClickListener() { public void onClick( DialogInterface d, int which) { ... } }) onClickListener Java
  • 7. Julia Controller touched: function(what) { if (what === “1”) { // ok } // cancel }
  • 8. XML XML <?xml version=”1.0” encoding=”utf-8”?> <shape xmlns:android=”http://schemas.android.com/apk/res/android” android:shape=”rectangle”> <gradient android:startColor=”#414141” android:centerColor=”#202020” android:endColor=”#080808” android:angle=”270” /> </shape>
  • 9. Julia HTML5/CSS3 View <div class=”btn” data-touchable=”takePicture”> <label class=”cam-gradient”></label> </div>
  • 11.
  • 12. Model + Template <ul class="table"> ! ! {% for(var i=0; i < x.length; i++) { %} ! ! <li data-touchable="pushProfileView" ! ! ! data-user="{{ x[i].gid }}:{{ x[i].screenName }}"> ! ! ! {% if (x[i].profileImageUrl) { %} ! ! ! ! <img src="{{ x[i].profileImageUrl }}"> ! ! ! {% } %} ! ! ! <div><label>{{ x[i].screenName }}</label></div> ! ! ! <span class="more"></span> ! ! </li> ! ! {% } %} </ul>
  • 13. Model + Template JSP Model View
  • 14. RESTful Model URL + Converter refresh : function(postId, apiUrl) { ! ! var url = apiUrl || (appNamespace.HOST + "/api/met/get"), ! ! ! data = {id: postId}; ! ! this.oauthREST(url, data, function(self, response) { ! ! ! self.patch(response); ! ! ! self.set({x: response}); ! ! }, null); ! }
  • 15. Julia MVC • HTML5/CSS3 View • REST Model • JSP Template • Delegation
  • 16. Julia SQLite jsi.sqlInsert( "keyvalue", { key: appNamespace.SNAP_HINT_DISPLAYED_KEY, value: "1" }, function(lastRow){});
  • 17. Julia SQLite • Table • • HTML5 Web Worker Web Storage
  • 18. Julia • JS Julia • Template • DOM Webkit Reflow/Layout • CSS3
  • 19. Julia DOM NavigationView View View DIV
  • 20.
  • 21. Python/Ruby/ Apache HttpClient • • •
  • 22. Julia API JS http://www.miankong.cc/julia/