[onsen-ui] タグが付いた質問
219
質問
5
票
2
回答
1,161
閲覧数
monacaでAngularjsとOnsenUIを使ってリストを表示したい
ネットで見かけたサンプルを使わせていただいてアプリを開発していますが、どうにも上手く表示させれないので質問させて頂きます。
どうも画面のほうが先に描画されている気がします。
アプリ起動時は何も表示できなくてpreタグで表示している配列も空なのですが。
タブバーのtestボタンをタップすると表示されます。
list.htmlはなぜかコピペできなかったので手書き、...
5
票
1
回答
1,483
閲覧数
ons-lazy-repeatで表示したons-listをons-pull-hookで更新したい。
表題の通り、ons-lazy-repeatで表示したons-listをons-pull-hookで更新したく
下記公式ドキュメントのサンプルコードを動かし、いろいろ試したのですが
ドキュメントに記載されている情報のみでは対応が難しい状況です。どのように実装すればよいのでしょうか。
http://ja.onsen.io/reference/ons-lazy-repeat.html
5
票
1
回答
3,293
閲覧数
AngularJS+ONSEN UI(tabbar)で初回起動とそうでない場合に出し分けをしたい
お世話になります。
環境:MoancaIDE / Chrome 最新版
Cordova 4.1.0
ONSEN UI 1.2.1
AngularJS: 1.3.0(ONSEN UI標準組み込み)
JQuery MonacaVer 2.0.3
iOS MonacaDebugger 3.2.0
■やりたいこと
タイトル通りなのですが、初回起動時にはサービス利用の同意画面を出したいと考えています。
...
4
票
2
回答
1,792
閲覧数
replacePageで画面遷移する際のアニメーションの方向を変えたい
Navigator.replacePageでページ移動する際にアニメーションなどを指定できますが毎回右から左になっているので逆からの遷移を表現できません。左から右にする方法はあるのでしょうか?
4
票
2
回答
2,530
閲覧数
ons-list内で最下部までスクロールした時のイベント
お世話になります。
質問させてください。
monacaでonsen-uiを使用しています。
ons-list内で最下部までスクロールした時のイベントをとりたいのですが、みなさんどうやって実装していますでしょうか?
最下部までスクロール → 自動読み込み このよくある機能を実装したいのです。
$(window).on("load scrol", hove);
...
4
票
1
回答
6,557
閲覧数
onsenui ons-navigator内のpushPageでパラメータを渡したい
お世話になります。
ons-toolbarでページ移行するappを開発中なのですが、
ons-listから詳細ページに移行する際にパラメータを渡したいのですが、
urlにパラメータを付加することは可能でしょうか?
またその際移行先のページでのパラメータの呼び出しはどのようにすれば良いのでしょうか?
...
4
票
1
回答
314
閲覧数
angular2 ons-navigator
angular2 ons-navigator ons-carouselを使ったページを作成していますが、以下の構成で実行すると*ngForが展開されません。
app.ts
@Component({
selector: 'app',
template: '<ons-navigator #myNavigator [page]="page"></ons-...
4
票
0
回答
315
閲覧数
Monaca+Angular+OnsenUIで、input が type="password"のとき、jQueryで値が正しく取得できない
Angular+OnsenUIで、input が type="password"のとき、以下のいずれの方法でも最後の文字が、パスワードの隠し文字に化けます。
jQuery("#passwordInput").val()
jQuery("#passwordInput").prop('value')
具体的なHTML
<input type="password" id="...
4
票
0
回答
2,823
閲覧数
ONSEN UI + JQueryのタブ切り替え時のons.readyとscriptについて
お世話になります。
MoancaIDEでiOS/Android向けアプリを開発中ですが、頻繁にJQueryによるAjax通信が動作しなくなり原因がわからず困っています。
というのも、そもそも別ページに記載したjavascriptが動作していないのではないかという疑念です。
環境:MoancaIDE / Chrome 40.0.2214.93 m
Cordova 4.1.0
ONSEN UI 1....
3
票
2
回答
480
閲覧数
ons-navigatorにて同一のページを複数表示した場合の、getElementByIdに代わるエレメント検索手段
Monacaにて、iPhone向けアプリ開発の勉強をしています。
ons-navigatorにて子画面として表示されたページ内に、以下のようなエレメントがあります。
<input type="search" id="id1">
このタグのvalueを取得し、pushPage("self.html",options)の第2パラメータとして与えたいと考えています。
問題点
通常ならば、...
3
票
3
回答
3,040
閲覧数
タブバーの推移先のhtmlファイルでjsを実行する
OnsenUIのタブバーを使っているのですが、タブバーの推移先で日付を表示したかったのでjsのDataクラスを使おうとしたのですが、動きませんでした。
タブバーの推移先のhtmlファイルに
<script>
var today = new Date();
document.write(today);
</script>
...
3
票
3
回答
970
閲覧数
<ons-tabbar>のメニューを変更するには
タイトルの通り、ons-tabbarのメニュー変更方法を探しております。
具体的には、A画面からB画面に遷移した際、ons-tabbar内のons-tabタグを
変更したいと思っております。
もしこの実装方法をご存知でしたら、ご教授のほどお願いいたします。
3
票
2
回答
1,480
閲覧数
ons-popover利用時のJavaScriptの変数の値について
monacaを使って開発してます。
その際、slidemenuを使う関係上、index.htmlにslidemenuを書き込み、navigatorをhomeに指定しました。
toolbarの左側にslidemenuを、右側にpopoverで通知を出したいと思い記述しましたが、上手く反応しません。タップしてもpopoverがなされません。
--home.html
<ons-...
3
票
1
回答
1,405
閲覧数
<ons-tab>タップ時の画面遷移カスタマイズについて
ONSEN UIで以下の実装を実現しようとしています。
タブ内のあるタブをタップする。
タップ後、「ng-click="app.navi.pushPage('page.html', { animation : 'lift' });"」と同様にページを下から上にスライドして新ページを表示する。
新ページはを非表示にする。
新ページから前ページに戻るときはページを上から下にスライドして前ページに戻る。...
3
票
1
回答
1,750
閲覧数
Onsen UI のスクロール位置について
初歩的な質問になりますがよろしくお願いします。
Onsen UIのons-tabbarを利用してTwitterのようにタブごとに分かれた機能を実装しています。
タイムラインのタブでコンテンツの一番下までスクロールした場合、古いコンテンツをAjaxで読み込んで表示させようと思っているのですが、jQueryの var h = $(window).scrollTop(); ...
3
票
1
回答
535
閲覧数
ons-pageを二重に配置したページからpushPageを行うと新しいページが2回追加されてしまう
pushPageで呼び出されたhtml内に<ons-page>を二重に配置しています。
<ons-page modifier="p2">
<img src="img/top.png" />
<ons-page modifier="p2_c1">
<img src="img/image.png" />
</ons-page&...
3
票
1
回答
630
閲覧数
Monaca Onsen UI でタブバーを2段表示したい
Monaca Onsen UIでタブバーを2段にして表示することは可能でしょうか
3
票
1
回答
140
閲覧数
Rangeのvertical配列は可能でしょうか。
現在、MonacaにてHTML5アプリを作ろうとしております。
CSS ComponetsのRangeについてなのですが、
http://ja.onsen.io/reference/css.html#range
スライダーをhorizontalだけでなく、verticalに配置することは可能なのでしょうか。
検索しても、Monacaの教則本を読んでも出てこなかったのでここで質問いたしました。
...
3
票
1
回答
282
閲覧数
Monaca(Onsen UI)で左右にスライディングメニュー表示した場合のスワイプで閉じた時の挙動について
スライディングメニューを左右に配置した場合、
左側をスワイプ操作で閉じるときは問題なくスムーズなのですが、
右側をスワイプ操作で閉じようとすると、
左側のスライディングメニューが開いてしまいます。
例)
http://databasefaq.com/index.php/answer/103174/onsen-ui-how-to-implement-two-slide-menu-on-both-...
3
票
0
回答
262
閲覧数
monacaでons-toolbarが画面外に消えてしまう。
iosで発生する問題となります。
monaca(onsenui)でテキストエリアなどにフォーカスした場合にキーボードが起動しますが、
キーボードが起動した状態で画面をスクロールするとons-toolbarが画面外に移動してしまいます。
こちら回避方法あるでしょうか。
3
票
0
回答
558
閲覧数
ons-lazy-repeat アイテムの高さを自動にできないのでしょうか?
表示するデータ量がアイテムごとに違う場合、アイテムの高さを自動にできないでしょうか?
ons.bootstrap();
var dataList = new Array();
$.getJSON("test.json", function(data){
dataList = data;
});
app.controller('MyCtrl', ['$scope', ...
2
票
1
回答
9,185
閲覧数
要素のid属性を削除したい
属性の削除についてお尋ねしたいことがあります。
以下にhtml文を載せます。
タグの中にあるid="newsitem"をjavascriptを使用して削除したいのですが、どのようにすればよろしいですか?
ご教授よろしくお願いします。
menu.html
<ons-list-item id="newsitem"
modifier="tappable" class="...
2
票
3
回答
4,256
閲覧数
スマホアプリでPDFを表示させたい
Monacaでスマホのアプリを作っています。
ある会場図をPDFで表示させたいのですが、どのようにさせたらよいでしょうか?
試しに下記にしてみたら、Couldn't load plug-in が表示されました。
<ons-page>
<object data="img/map.pdf" id="info_map" type=&...
2
票
1
回答
6,141
閲覧数
複数のhtmlファイルとons-templateを併用するとうまく動かない
monacaクラウドでOnsenUI/AngularJSを使いアプリ制作の勉強中です。
複数の画面があるアプリで、基本的にはhtmlは1ファイルにまとめたいのですが
リリースに含まれるページとデバッグ目的ページなどは分離したいので
2つのhtmlファイルに分けたところ、変な動きをします。
case A
最初はdebug.htmlが正しく表示されず、またpageA、pageC(奇数目のページ)...
2
票
2
回答
1,256
閲覧数
ons-popover 内で ons-scrollerが使えない
ons-popover内にons-listを使用していくつかの機能を提供する、ドロップダウンメニューを作っています。 メニューの項目数が多いので、ons-scrollerでスクロールさせたいのですが、スクロールが機能せず、一部分のみしか表示されません。低い解像度の端末でも表示できるよう、スクロール機能を付けたいのですが、どのようにすればよいのでしょうか?
ons.bootstrap();
...
2
票
1
回答
1,527
閲覧数
<ons-carousel-item>コンポーネントを追加した場合refresh()メソッドの使い方
ons-carousel-itemコンポーネントをons-carouselコンポーネントにjsで追加した場合refresh()メソッドを読んでレイアウトを更新する必要があります。
とonsenuiのガイドに記載されているのですが、具体的にどのようにjsに組み込めば良いのかわかりません。
お分かりになる方ご教示ください。
2
票
1
回答
763
閲覧数
ons-alert-dialogの表示スタイルを変更したい
ons-alert-dialogを使用して表示されるアラートダイアログのスタイルを変更したいです。
ブラウザからサンプルを開くと、アラートダイアログはiOSのようなデザインで表示されるのですが、Android上で同じスクリプトを実行するとアラートダイアログはAndroidのようなデザインで表示されてしまいます。
...
2
票
1
回答
799
閲覧数
pushPage終了時のちらつきが気になる。
Cordova & OnsenUI で AngularJSベースに開発しています。
OnsenUIのpushPageメソッドにて画面遷移をした場合に、iOS端末(iPhone6,iOS8)にて、ちらつきが発生してしまいます。
対策として、プレフィックス付きで、
backface-visibility: hidden;
を設定してみましたがちらつきが抑えられていません。
また、...
2
票
1
回答
1,342
閲覧数
親画面が子画面の値を見る方法
myModule.controller('manager_information_controller', function($scope, member){
//親画面から呼ばれる関数
$scope.showModalForMemberInformation = function(){
modal_manager.show();
...
2
票
1
回答
2,052
閲覧数
OnsenUIで画面遷移のボタンを複数押すと、押した分画面が出てきてしまう件
<ons-button modifier="quiet" ng-click="Navigator.pushPage('hoge.html', { animation : 'lift' } )">hoge</ons-button>
というボタンを設置して、
そのボタンを複数回押すと、押した数だけ画面が出てきてしまいます。
それを防ぐような処理はどうしたら良いでしょうか?
...
2
票
1
回答
2,026
閲覧数
cordovaプラグインのアプリ内課金の処理をAngularjsで行いたい
お世話になります。開発環境はMonacaクラウドでアプリを開発しています。無料版は広告あり、アプリ内課金によって広告を非表示にしたいと考えています。
そこでアプリ内課金の処理をcordova-plugin-inapppurchase によって実装しました。こちらは問題なく動きました。(※コメントアウトされている処理が当該部分です。)
ただ、広告表示のフラグや価格表示などをAngularjsの$...
2
票
1
回答
1,708
閲覧数
Onsen UI のラジオボタンで初期設定をしてもチェックマークが表示されない
ons-listでRadiobutton Listを実現したく、以下のコードを実装しております。
これでコマンド $ cordova emulate ios を実行しシミュレータを表示したところ、メニューの右側(先頭のみ)にチェックマークが表示されません。
「ng-repeat」で各値を取得できているのは確認できたのですが、HTMLに生成し表示する際にうまくいってないようです。
...
2
票
2
回答
1,015
閲覧数
navigator.resetToPage()の際にnavigator.getPages()が正しい値を返さない
onsen-uiのnavigatorを利用しています。ページスタックがある場合のみ「戻る」ボタンを表示するようにしたいのですが、navigator.resetToPage()から発生するprepush, postpushイベント内ではnavigator.getPages()が正しい値を返さないようです。
navigator.on("prepush", function(e) {
var ...
2
票
1
回答
716
閲覧数
ons-list の初期位置
ons-list を使用したアプリを作成していますが,起動時に,リストを最下段までスクロールした状態で起動したいと考えています.うまい方法はないでしょうか.
2
票
1
回答
769
閲覧数
angular-resourceを使うとonsenuiが動かない
Onsen UI 最小限のテンプレートに下記URLを参考にした検索を組み込みたいのですが
競合してしまっているのかonsenui、検索システムどちらかしか動きません。
http://www.walbrix.com/jp/blog/2014-01-angularjs-resource.html
<html lang="ja" ng-app="MyApp">
<head&...
2
票
1
回答
522
閲覧数
onsen-ui で angular-translate を利用したい
お世話になります。
Cordova + onsen-ui + angular-js でアプリケーションを開発しています。
国際化対応のため、こちらのサイト(http://qiita.com/ukiuni@github/items/1d1b47e274ac204709c9) を参考に angular-translate を入れ込んだところ、以下のエラーメッセージが表示されてしまいます。
...
2
票
1
回答
1,622
閲覧数
ons-lazy-repeatがうまく動きません。
現在、angularJSとonsenUIを用いて、開発中です。
onsenUIのons-lazy-repeatを使ってみたのですが、上手く動きません。
maincontrollerに適当なメソッドを追加してよぶことはできているので、コントローラーとの接続ミスではないと思うのですが、色々いじっても動かず途方にくれています。
どこが問題なのか指摘していただけるとありがたいです。
index....
2
票
1
回答
1,104
閲覧数
OnsenUIでツールバーやタブバーを固定するには
ツールバーやタブバーを利用した場合、ブラウザによっては上下にスクロールできてしまいます。
HTMLやCSSの記述を工夫することで、位置を完全に固定する方法はあるでしょうか。
OnsenUIの例(iPhoneのSafariで表示すると画面全体がスクロール対象となる)
http://s.codepen.io/onsen/fullembedgrid/pGuDL
SenchTouchの例(...
2
票
1
回答
2,475
閲覧数
tabbarとカルーセルを組み合わせてメニューを組みたい
今サンプルのプログラムを使っていろいろ試しているところなのですが、
tabbarとカルーセルを組み合わせてメニューを作りたいのです。
イメージ的には最新のlineやカカオみたいな感じなのですが、
可能なのでしょうか?
いろいろ調べているのですが、なかなか見つからなくて・・・・
お手数をおかけしますがよろしくお願いします。
2
票
1
回答
355
閲覧数
Monaca OnsenUIのボタンが消える
お世話になります。
MonacaでiOSアプリの開発を行っています。
Monacaデバッガで起動した際、OnsenUIを使った以下のボタンをクリックすると、
iOS(iPad)の場合だけボタンが消えます。
押したボタンだけでなく、表示されている全てのボタンが消えます。
表示は消えますが、同じ場所をクリックすると一瞬ボタンが表示され、クリック
イベントはキックされます。
...
2
票
1
回答
235
閲覧数
Onsen-UI上でオーバーライドした$exceptionHandlerが実行されない
お世話になります
onsen-ui+angularJSを使用してアプリケーションを作成したところ、オーバーライドしたAngularJSの$exceptionHandlerが実行されたり、されなかったりするという現象が発生しました。
いろいろ調べたのですが、法則性が見つからず原因が特定できません。
代表的なものとして、通常の例外は$exceptionHandlerがキャッチしてくれるのですが、
...
2
票
0
回答
232
閲覧数
pushPage後のcss変更タイミングを早めるには?
「Onsen UI最小限のテンプレート」を元に、2ページ間を前後に行き来するアプリを作りました。
それぞれのページに異なる画像を1枚ずつ貼り付けていて、page1.htmlのons-buttonのクリックでpage2.htmlに遷移した際に画像を50%に縮小して表示させたいのですが、私が書いたコードでは一旦100%サイズで表示してから一瞬遅れて50%で再描画されます。
pushPage後、...
2
票
1
回答
1,201
閲覧数
【monaca】pushPageで遷移後、ons-gesture-detectorで取得できるイベントの挙動について
表題の件につきましてOnsenUI最小テンプレを例に記述いたします。
まずindex.htmlを以下のように設定し、
<ons-navigator var="myNavigator" page="page1.html" ng-controller="navControlle">
</ons-navigator>
page2.htmlを以下のように設定しています。
&...
2
票
2
回答
1,114
閲覧数
Onsen UIとjQuery Mobileを組合せた場合における制限の有無について
Onsen UIとjQuery Mobileを組合せてHTML5ハイブリッドアプリを開発した際に、
何か制限などはあるのでしょうか?
全体としては、PhoneGap+Onsen UI+jQuery Mobile+Backbone.jsでの実装を考えています。
Onsen UI側、jQuery Mobile側どちらかで制限が出てしまう場合は
事前に把握しておきたいため、質問致しました。
...
2
票
1
回答
494
閲覧数
<ons-dialog>コンポーネントで戻り値を指定したい
よろしくお願い致します。
<ons-dialog>のons.notification.fonfirmを使用しています。
下記のようなコードを書きました。
function showDialog(message) {
ons.notification.confirm({
title: "確認",
message: message,
...
2
票
0
回答
201
閲覧数
OnsenUI v1.2.1 にアップデート後、エラー
OnsenUI v1.1.4 → v1.2.1 にアップデートしたところ、
TypeError: object is not a function
at Object.CALL_NON_FUNCTION (native)
at file:///data/data/mobi.monaca.debugger/files/projects/cloud/******/www/...
1
票
2
回答
943
閲覧数
ons-tabbarを冗長なコードを書かず上部ツールバー下へ配置したい
ons-tabbarをアプリケーション下部もしくは最上部へ配置する場合は、ons-tabbarタグは一つ書けばアプリケーション全体で表示されるかと思います。
このons-tabbarを上段ツールーバー下へ配置する場合はons-page内に書く必要があるため、非常に冗長的なコードになってしまいますし、タブ状態の集中管理が出来ません。
Ionicでのタブバー上段配置のような形にしたいのですが、...
1
票
1
回答
3,947
閲覧数
OnsenUI Navigatorのpushpage内をリロードさせたい
いつもお世話になっております。
表題の通り、navigatorにてpushpageに移動後pushpage内をリロードさせる事は可能でしょうか?
こちらはpushpageにて外部DBから情報を抽出するにあたり、ネットワークエラー等が生じた場合にページをリロードさせたい為です。
どなたかご教示いただけると幸いです。
よろしくお願いいたします。
1
票
2
回答
255
閲覧数
<ons-carousel>のメソッドについて教えて下さい。
ons-carouselのメソッドを幾つか試しています。
ons-carouselから以下の情報が取得できるのでしょうか
ons-carousel-item要素数
自ons-carousel-itemが最終かどうか(true,false)
もし上記情報の取得情報がご存知でしたら、ご教示のほどお願いいたします。
1
票
1
回答
2,187
閲覧数
ons.notification内で改行したい
ons.notification.alertのメッセージ内で改行したいのですが、うまく動作しません。
「<br>」「\n」「\\n」の3つを試してみたのですが、そのまま文字として表示されてしまい、改行できませんでした。
どうすれば改行できるのでしょうか?