HTML 5を使用してiOSオリジナルアプリを構築(2)
1721 ワード
問題が発生したシーンはwebviewにフィルタがあり、私が(携帯電話で実際にタッチしている)フィルタをクリックすると、ページの内容が変わりますが、完全にローカルで、データ転送などは関係ありません.
今回解決する体験問題は、クリックイベントが発生するとページが点滅することです.
研究の結果、解決策は
置換先:
コードは簡単ですが、新しい問題が発生しました.セレクタを押すと、急に注文したくなくなり、指を滑らせて放します.私の予想はもちろんイベントがキャンセルされたが、
touchmoveイベントが発生したかどうかを検出し、解決策を生み出す必要があります.
指がスライドしたかどうかを示す変数
ページが点滅しなくなりました.
今日解決しなければならない問題は、HTML 5を使って作成(webview)するとき、垂直スクロールバーが出てくると、指がページをスライドしてスクロールした後、スクロールがすぐに止まり、ブレーキを踏んで運転しているようで、「スクロールが大変」な感じがします.オリジナルのUItableViewなどのスクロールは非常に速い.
私が前に考えた理由は、ブラウザがwebviewをレンダリングする再描画が非常に困難である可能性があります.例えば、絶対的な位置決め、華麗なCSSなどです.iOSシステムは、スクロール速度を低下させ、webviewスクロール時のFPSを強化することを選択しました.
実際にはそうではありません.シーンが異なるためか、アップルはユーザーがページを閲覧する際に、ページのスクロールをそんなに速くしなくてもいいと考えているので、webviewに対してより高い「減速率」、つまりscrollViewの
HTML 5でアプリケーションを作成する場合は、UItableViewなどのオリジナルコンポーネントのスクロール速度をシミュレートしたいので、コードは簡単です.
今回解決する体験問題は、クリックイベントが発生するとページが点滅することです.
研究の結果、解決策は
click
イベントに対するバインドをtouchend
に置き換えることであることが分かった.tagdom.addEventListener('click',function(ev){
...
}
置換先:
tagdom.addEventListener('touchend',function(ev){
...
}
コードは簡単ですが、新しい問題が発生しました.セレクタを押すと、急に注文したくなくなり、指を滑らせて放します.私の予想はもちろんイベントがキャンセルされたが、
touchend
は実行され、ev.target
は依然として前の要素である.touchmoveイベントが発生したかどうかを検出し、解決策を生み出す必要があります.
var isScrolling = false;
window.addEventListener('touchstart', function () { isScrolling = false; });
window.addEventListener('touchmove', function () { isScrolling = true; })
指がスライドしたかどうかを示す変数
isScrolling
があります.スライドが発生していなければ、touchend
が有効になります.tagdom.addEventListener('touchend',function(ev){
if(isScrolling == false){
...
}
}
ページが点滅しなくなりました.
今日解決しなければならない問題は、HTML 5を使って作成(webview)するとき、垂直スクロールバーが出てくると、指がページをスライドしてスクロールした後、スクロールがすぐに止まり、ブレーキを踏んで運転しているようで、「スクロールが大変」な感じがします.オリジナルのUItableViewなどのスクロールは非常に速い.
私が前に考えた理由は、ブラウザがwebviewをレンダリングする再描画が非常に困難である可能性があります.例えば、絶対的な位置決め、華麗なCSSなどです.iOSシステムは、スクロール速度を低下させ、webviewスクロール時のFPSを強化することを選択しました.
実際にはそうではありません.シーンが異なるためか、アップルはユーザーがページを閲覧する際に、ページのスクロールをそんなに速くしなくてもいいと考えているので、webviewに対してより高い「減速率」、つまりscrollViewの
decelerationRate
属性を設定しました.HTML 5でアプリケーションを作成する場合は、UItableViewなどのオリジナルコンポーネントのスクロール速度をシミュレートしたいので、コードは簡単です.
//
self.webView.scrollView.decelerationRate = UIScrollViewDecelerationRateNormal;