タグ

ionicに関するshin0Oのブックマーク (8)

  • Ionic Frameworkを用いたデスクトップレイアウトを考える - Qiita

    Web技術でモバイルネイティブなユーザインタフェースデザインを提供するIonic Frameworkですが、Webで配信するとユーザのデバイスはモバイルだけということはなく、ユーザはデスクトップで閲覧する可能性もあります。そこで、デスクトップに対応させるいくつかのレイアウトのヒントをご紹介します。 1. SideMenuレイアウト まず一番ベーシックなデスクトップ対応はSideMenuを利用することです。TechFeed Proなど広く採用されています。 ポイントとしてはモバイルレイアウトではハンバーガーメニューをSideMenuをあくまでメニューの配置だけに利用することが多いですが、デスクトップではSideMenu上部(左上)にロゴを配置することが重要です。 デスクトップレイアウトでは左上もしくは上部中央にロゴがあることが多く、ロゴさえあればそれっぽく見えます。(暴論 もっとシンプルに配

    Ionic Frameworkを用いたデスクトップレイアウトを考える - Qiita
    shin0O
    shin0O 2020/03/25
  • Storybook

    shin0O
    shin0O 2019/10/24
    ionicのコンポーネントを試すやつ
  • [ Ionic ]キーボード出現時にフッターを押し上げてしまう問題の対応 | コーテッグのバケツ

    こんにちは。たなかです。 IonicFrameworkでモバイルアプリを開発させてもらっています。 開発したアプリを内部レビューしている時に、以下の問題にぶつかったので解消方法とともにメモしておこうと思います。 フォームをタップしてキーボードを表示した際、 キーボードがフッターを持ち上げてしまう! 具体的には以下のような感じ。 画面の一番下にあるフッターと赤色のバナー部分がキーボードに押し上げられてしまっています。 機能的にエラーがあるわけではありませんが、ボタンの誤入力を誘発してしまいますし、なにより見た目がスマートじゃないので対応することになりました。 解決方法 ①app.component.tsにconfigを追記 以下の内容をapp.component.tsのconstructorに追記します。 constructor(){ this.config.set("ios", "scro

    [ Ionic ]キーボード出現時にフッターを押し上げてしまう問題の対応 | コーテッグのバケツ
    shin0O
    shin0O 2019/08/26
  • Cordovaをdisる人類全員に読んでほしい「Cordovaつらいを考える」|榊原昌彦

    以下の記事で「Cordova/Ionicに比べれば、まだ少しはまともな選択だろう」と述べてあるのをみて、ここ数年Web Nativeに関わって思うことをちょっとまとめてみようと思います。 私はWeb Developerですので、この記事はWeb Native寄りの意見になります。また、記事内では、いわゆるWeb Viewでつくるガワアプリを「Web Native」、それ以外(React Native/Native Script/Swift/Kotlinなど)をまとめて「Mobile Native」と呼称しております(分類はWhere Does Ionic React Fit in the React Ecosystem?から) note: Cordovaつらいって言っちゃだめという記事ではありません。OSSの活動は続いてるので、伝聞や過去のものではなく、最新のCordovaやWeb Na

    Cordovaをdisる人類全員に読んでほしい「Cordovaつらいを考える」|榊原昌彦
  • Ionicによるプライベートプロダクト開発の裏側事情 - Qiita

    記事は2018年4月14日に行われた「HTML5プロダクトの裏側事情」 Ionic Meetup Nagoya #1の発表用資料です。 URLは「https://goo.gl/2S5Cmz」です すいません。当日の資料を一旦削除して修正して再度アップしてます。 この資料について質問がありましたら@scrpgilまで連絡ください。 自己紹介 会社員とフリーランスの両輪生活をしています。 Ionic、Go仕事でよく使います。 概要 個人的に開発しているAA(MLT)ビューアーについて技術選定や実装内容について話します。 参考リンク AAHub - スマホ対応のAAビューアー&Twitter投稿サイト 作ったサイトの紹介 AAの「まとめzip」を Web 上で閲覧できるようにしたサイトです。 主な機能 1.スマホ&PCの両方に対応しています。 2.AAが作品別に整理されており探しやすいです。

    Ionicによるプライベートプロダクト開発の裏側事情 - Qiita
    shin0O
    shin0O 2019/04/03
  • Ionicハンズオン資料 - Qiita

    はじめに こんにちは!! では、今からIonicを用いてWebアプリケーションを作成していこうと思います。 時間がないので、サクサクと進めていきますね! もっとじっくり学びたい? そういう方にはオススメのがありますので、こちらでじっくり学んでくださいね :-p Ionicで作る モバイルアプリ制作入門〈Web/iPhone/Android対応〉 2019年11月27日にIonicの第2版が発売されました🎉!! 記事はIonic v3の内容に基づいています。 より洗練されたIonic v4に触れたい、学びたい方はこちらでどうぞ! Ionicで作る モバイルアプリ制作入門[Angular版]<Web/iPhone/Android対応> 自己紹介 こざけ (Twitter: @s_kozake) システムアーキテクト Java屋 🍻(´∀`*v) 今から作るもの 「イベントさん」という名

    Ionicハンズオン資料 - Qiita
    shin0O
    shin0O 2018/08/17
  • Ionic 2 から 4 への、この2年間の進化を振り返る|リレーションデザイン研究所

    Angular 2から6までの主要な進化をまとめた記事を読みたい」とツイートしたら、Angularの強い人にIonic情報とのトレードを提案いただいたので、Ionic 2から4までのIonicとその周辺ライブラリの進化を時系列にまとめていきます。 Angular v2からv6までの変化をまとめてみた とあわせてご覧ください。 なお、Ionicって何よ?という方は少し古い記事となるのですが「Angular 2を使うならUIはコレで!Ionic 2ことはじめ」をご参考ください。 Ionic v2 2016年2月11日 私のIonicをプロダクト採用したレポジトリをみると、この日の angular2@2.0.0-beta.2 / ionic-framework@2.0.0-alpha.57 が最古のコミットになっておりました。技術調査はもうちょっと前からしていましたが、記事のスタートラインは

    Ionic 2 から 4 への、この2年間の進化を振り返る|リレーションデザイン研究所
    shin0O
    shin0O 2018/05/08
  • Ionicによるプライベートプロダクト開発の裏側事情 - Qiita

    記事は2018年4月14日に行われた「HTML5プロダクトの裏側事情」 Ionic Meetup Nagoya #1の発表用資料です。 URLは「https://goo.gl/2S5Cmz」です すいません。当日の資料を一旦削除して修正して再度アップしてます。 この資料について質問がありましたら@scrpgilまで連絡ください。 自己紹介 会社員とフリーランスの両輪生活をしています。 Ionic、Go仕事でよく使います。 概要 個人的に開発しているAA(MLT)ビューアーについて技術選定や実装内容について話します。 参考リンク AAHub - スマホ対応のAAビューアー&Twitter投稿サイト 作ったサイトの紹介 AAの「まとめzip」を Web 上で閲覧できるようにしたサイトです。 主な機能 1.スマホ&PCの両方に対応しています。 2.AAが作品別に整理されており探しやすいです。

    Ionicによるプライベートプロダクト開発の裏側事情 - Qiita
  • 1