HTML5+ モバイル アプリ開発チュートリアル 4 - mui_html/css_WEB で開いている複数のページの違い - ITnose

【はじめに】

私はしばらくhbuilder+muiを使ってアプリを作りましたが、途中で色々な問題に遭遇しました

詳しくはhttp://を参照してください。 uikoo9.com/dishi/download

If これよりレベルが高い場合は、読む必要はなく、読み飛ばしてください。

【レベル】

hbuilder+muiの使い方に興味があるのでソースコードは見ていません

使い方まとめレベルに留まっていますのでご安心ください。何か間違っている場合はコメントしてください。 ...

【例】

1. 初期化中にサブページを作成する

mui.init({    subpages: [{        url: your - subpage - url, //子页面HTML地址，支持本地地址和网络地址        id: your - subpage - id, //子页面标志        styles: {            top: subpage - top - position, //子页面顶部位置            bottom: subpage - bottom - position, //子页面底部位置            width: subpage - width, //子页面宽度，默认为100%            height: subpage - height, //子页面高度，默认为100%            ......        },        extras: {} //额外扩展参数    }]});

2. 新しいページを直接開く

mui.openWindow({    url: new - page - url,    id: new - page - id,    styles: {        top: newpage - top - position, //新页面顶部位置        bottom: newage - bottom - position, //新页面底部位置        width: newpage - width, //新页面宽度，默认为100%        height: newpage - height, //新页面高度，默认为100%        ......    },    extras: {        ..... //自定义扩展参数，可以用来处理页面间传值    }    show: {        autoShow: true, //页面loaded事件发生后自动显示，默认为true        aniShow: animationType, //页面显示动画，默认为”slide-in-right“；        duration: animationTime //页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；    },    waiting: {        autoShow: true, //自动显示等待框，默认为true        title: '正在加载...', //等待对话框上显示的提示内容        options: {            width: waiting - dialog - widht, //等待框背景区域宽度，默认根据内容自动计算合适宽度            height: waiting - dialog - height, //等待框背景区域高度，默认根据内容自动计算合适高度            ......        }    }})

3.

【いくつかの違い】

1. サブページと非サブページ

上記 3 つの方法のうち、2 と 3 で開いたページはサブページではありません。

違いは、サブページは HTML の iframe に相当し、そうでないことです。 -サブページは、新しいページを開くのと同じです

2 サブページは、サイドスライド メニューに適しています

サブページには、特に、index.html+list.html に適しています。

index.htmlを使用する場合(メインページ)+list.html(サブページ)を実装すると、メインページが右にスライドするとサブページも自動的に追従します

そしてindex.htmlで実装すると(メイン ページ) + list.html (新しいページ) の場合、メイン ページは右にスワイプしても新しいページは右にスワイプしないため、新しいページを個別に処理する必要があります。

3. サブページが頻繁に切り替わる場合、

より低い設定の携帯電話では、list.html がindex.html をカバーしてしまう可能性が高くなります。新しいページモードの使用方法。

4. サブページはプルダウン更新とプルアップ読み込みに適しています

以前大規模なプルダウン更新をしたときは、新しいページのフォームを使用しました

公式ウェブサイトに従ってチュートリアル、どうやっても失敗しました、

後でソースコードを見たところ、プルダウンの更新はサブページの形式でなければならないことが分かりました

つまり、list.html は次のようにする必要がありますプルダウンして更新する前に、index.html のサブページを表示します。

5. 新しいページは新しいページに適しています

新しいページを開く必要がある場合、詳細を表示するのに適した新しいページを開きます

そして mui 自体は の back メソッドをカプセル化します。新しいページです、心配する必要はありません。

6. ページをプリロードする 2 つの方法

1 つ目は、初期化中にプリロードすることです。

この状況は、このページを久しぶりに使用するのに適しています。

すぐに使用したい場合は、ページを使用して使用すると、null が返されます。

2 番目のメソッドは open と似ています。

個人的には、大きな違いはありません。

唯一の違いは、open は直接開くことです。

preload はロードするだけで、後で開く時間を選択できることです。

7. 概要

プルダウンして更新し、プルアップしてロードする必要がある場合は、サブページを使用してください

新しいページを開く必要がある場合は、新しいページ方法を使用してください

ページをロードする必要がありますが、一時的に使用しない場合は、プリロード方法を使用してください。