57

iPhone(Safari)でステータスバー/ツールバーを消す方法[iOS7.1- /viewport minimal-ui]

iOS7にアップデートされた際に、mobaile Safariでステータスバー/ツールバーを消すフルスクリーン対応にすることがほぼ完全に不可能になっていました。

しかし、今回のiOS7.1にアップデートのタイミングで viewport に minimal-ui を追加するだけで、mobaile Safariのステータスバー/ツールバーを消す事が可能になりました。

具体的な指定は以下になります。

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, minimal-ui" />

sample
qr.png
ステータスバー/ツールバーを表示させるには、縮小版ステータスバーをタップすると表示されます。
戻る/進むなどのツールバーも消えてしまうので、ユーザービリティが低くなる点も考慮して、設定をしてみてください。

56

[iPhoneアプリ]今こそ乗り換えるべきiOS7/フラットデザイン対応のQRコードリーダー

img_140118_01.png


iOS7に対応したシンプルで使いやすいQRコードリーダーをリリースしました。
たくさんのQRアプリがありますが、もしAppleが純正のQRリーダー機能を付けたら、どう実装されるかを意識しています。UIは当たり前ですがiOS7に対応させ、読み込んだQRをSafariでもChromeでも選べるようにしましています。

特徴としては、

■徹底的にシンプル
アプリ起動と共にカメラが起動し、印刷されたQRコードや画面上に表示されたQRコードを瞬時に読み取り、内蔵ブラウザで表示します。

■履歴機能
直感的に分かりやすいスクリーンショットの履歴ページを用意いたしました。

■お気に入りのブラウザの選択
SafariやChrome、みなさんそれぞれの好みでメインブラウザを決めていると思います。QR Readerは内蔵ブラウザからsafariとchromeを起動して確認することもできます。

img_140118_01.png

55

ソーシャルゲーム(GREE/Mobage/Ameba)スマホサイトをPC/パソコンでプレイする為にUser Agentを設定する方法

ソーシャルゲームをやるときは大体スマートフォンで遊ぶ事になっていますが、GREE、Mobage、Amebaのゲームはまだ大半がブラウザゲームなのでもちろんPCでも設定をすれば遊ぶ事ができます。今回はChromeブラウザの設定になります。

[STEP.0]
見たいページを開きます


[STEP.1]
メニューからデベロッパーツールを選択

img_140103_01.png

ツール > デベロッパーツールで選択します。



[STEP.2]

ブラウザ下に表示されたデベロッパーツールの右下のネジアイコンを選択

img_140103_02.png
※新しいChrome(2014/2/10以降にアップデートした方)は、
ネジアイコンの左にある
>≡
↑このアイコンを押して表示されるEmulationタブをクリックしてください。


[STEP.3]
SettingsのOverridesで設定する

img_140103_03.png

設定する内容は、

  • [ √ ]Enable
  • [ √ ]User Agent (iPhone か Chrome-Android)
  • [ √ ]Device metrics(Screen resolution:320 x 480)
    ↑単なる表示画面サイズなのでモニタのサイズに合わせて設定してください。
  • [ √ ]Emulate touch events


[STEP.4]
そのまま更新すると、スマホサイトが表示されます。


(※クリックしても進まない時は...)

ゲームの作り方によっては、タップしたイベントを、Clickで取得している場合と、Touchで取得している場合があります。これは作る側でバラバラなので、何度もクリックしても進まない事があります。

この場合は、[STEP.3]で設定したOverridesの中に「Emulate touch events」があるので、これを切り替えると認識されます。

54

[illustrator CC]複数アートボートでの座標を単体のアートボード内座標に変更する

ほぼ自分用メモですが、
illustrator CCで、複数のアートボードで作業をしていると、2個目や3個目のアートボードで座標が大きくなっている現象がおきます。

例えば、
---------------------------
アートボードサイズ:640px
間隔:40px
---------------------------
の場合、
アートボード1の左上に配置したオブジェクトのX座標は0ですが、
アートボード2の左上に配置したオブジェクトのX座標が680pxになってしまう場合です。
↑これは定規の基準がウィンドウ定規になっています。

各アートボード内での座標にしたい場合は、アートボード定規に設定をする必要があります。


設定方法
表示 > 定規 > アートボード定規に変更
で変更することができます。

53

WindowsとMacのファイルパスを一瞬で変換してくれるWebサービス | Pathcon

http://bootgraph.com/pathcon/

共通のファイルサーバーでWindowsユーザーとMacユーザーが一緒に作業をしているときに、必ずおこる問題が、ファイルパスの違いがあります。

通常、Windowsユーザー同士であれば、もらったファイルパスを検索エリアにコピペをすれば、直接アクセスできますが、Macユーザーからもらったパスからはアクセスが出来ないため、ファイルを辿っていかないといけません。

変換する方法は、ググるといろいろ出てきますが、アプリケーションをダウンロードする必要があったり、わざわざ/(スラッシュ)を\(バックスラッシュ)に毎回変換するなど、時間も手間もかかります。

そこで登場したのが、WindowsとMacのファイルパスを一瞬で変換してくれるWebサービス | Pathconです。


使用方法
  1. MacかWindowsのテキストエリアに変換したいファイルパスをコピペするだけです。
img_131126_sub.png


Page: <<前の5件  1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11