質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Firebase

Firebaseは、Googleが提供するBasSサービスの一つ。リアルタイム通知可能、並びにアクセス制御ができるオブジェクトデータベース機能を備えます。さらに認証機能、アプリケーションのログ解析機能などの利用も可能です。

AngularJS

AngularJSはオープンソースのJavaScriptフレームワークです。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としています。

Onsen UI

HTML5で記述されたモバイルアプリの高速化、およびネイティブアプリライクなUIが作れるフレームワーク。 様々なJavaScriptフレームワークと併せて使用することができます。スマートフォン向けアプリ、Webサイトに必要なアニメーション、UI/UXを実装することが可能になります。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

Q&A

解決済

1回答

319閲覧

ons-lazy-repeat表示画面でのキーボード入力

awake

総合スコア11

Firebase

Firebaseは、Googleが提供するBasSサービスの一つ。リアルタイム通知可能、並びにアクセス制御ができるオブジェクトデータベース機能を備えます。さらに認証機能、アプリケーションのログ解析機能などの利用も可能です。

AngularJS

AngularJSはオープンソースのJavaScriptフレームワークです。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としています。

Onsen UI

HTML5で記述されたモバイルアプリの高速化、およびネイティブアプリライクなUIが作れるフレームワーク。 様々なJavaScriptフレームワークと併せて使用することができます。スマートフォン向けアプリ、Webサイトに必要なアニメーション、UI/UXを実装することが可能になります。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

0グッド

0クリップ

投稿2017/12/19 12:00

OnsenUI+AngularJS1にてons-lazy-repeatを用いたチャットツールを作成しています。
ons-lazy-repeatを設置した画面上で、テキストボックスも設置しています。

ons-lazy-repeatは動作するのですが、データ件数500件くらいから、
・テキストボックスにフォーカスIN(OS標準の入力パッドが表示される。)
・なにかしら入力してSubmit()
・データが保存され、ons-list-itemが新しく1行書き出される
・テキストボックスからフォーカスOUT(OS標準の入力パッドが非表示される。)
すると、入力パッドが消えた高さ分だけ?不正なons-list-itemが表示されます。
下にスクロールしたり、画面を更新したりすると再描画され、正常に表示されるのですが、おそらく入力パッドが表示される際に、画面全体が上に上がり、入力パッドが非表示されると画面全体が下に下がった際に、delegate内の位置が入力パッドの高さ分だけ狂っているような気がします。

これを回避する手段はありませんでしょうか?

html

1<ons-list> 2 <ons-list-item ons-lazy-repeat="delegate"> 3 {{comment.body}} 4 <ons-list-item> 5</ons-list> 6<ons-bottom-toolbar> 7<form name="form" novalidate ng-submit="submit()"> 8 <input type="text" name="body" id="timeline_body" class="form-control form-block mt-1" required ng-model="body"> 9</form>

javascript

1$scope.delegate = { 2 configureItemScope: function(index, itemScope) { 3 itemScope.comment = $scope.comments[index]; 4 }, 5 countItems: function() { 6 return $scope.comments.length; 7 }, 8 calculateItemHeight: function() { 9 return ons.platform.isAndroid() ? 48 : 44; 10 } 11};

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

データ件数500件というのがどういう状況なのか詳しくわかりませんが,必要な件数に絞ったほうが良いと思います.
Firebaseはダウンロードするデータが多ければ,それだけ課金もされます.

投稿2017/12/19 12:23

Yatima

総合スコア1159

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

awake

2017/12/21 09:08

ご返信遅くなりまして申し訳ありません。回答ありがとうございます。 確かに設計上(Firebaseの課金もあり)無理があるかもしれないと認識し、仕様をデータ件数を絞る方向で調整致しました。 ご回答ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問