Category Note

New!

CSS3: background ショートハンド(複数指定) background-size の記述方法

久しぶりに CSS を書いていると、ついつい忘れてしまうのが background のショートハンドです。 今回は background ショートハンドへ background-size を記述する方法をメモしておきます。 目次 background ショートハンド(複数指定) background-size の記述方法 まとめ background ショートハンド(複数指定) background-size の記述方法 以下、background でよく行うであろうプロパティを個別に記述した場合、ショートハンドで記述した場合のサンプルをそれぞれ用意しました。 background 個別指定 background ショートハンド(複数指定) ショートハンドでは /cover とすることで background-size: cover を指定することができます。 まとめ CSS の background ショートハンドは CSS2 では多様していましたが、CSS3 からは設定項目が大幅に増えたため、コードの見通しが悪くなってしまいがちです。 慣れないうちは、多少面倒でも個別にプロパティを指定し記述する方法が、混乱も少なくいいのかもしれませんね。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。
New!

HTML: Atom から Shift + Enter で改行タグを挿入するカスタマイズ方法

一部の HTML エディタでは Shift + Enter キーで br タグ が自動挿入されとても便利です。 今回はこの動きを Atom エディタで再現したいと思います。 目次 Atom から Shift + Enter で改行タグを挿入するカスタマイズ方法 まとめ Atom から Shift + Enter で改行タグを挿入するカスタマイズ方法 Atom を起動し、メニューの Atom -> 起動スクリプト を選択します。 init.coffee ファイルが開きますので、以下のコードを記述し保存します。 init.coffee 次に、メニューの Atom -> キーマップ を選択します。 keymap.cson ファイルが開きますので、以下のコードを記述し保存します。 keymap.cson Atom を再起動すれば、Shift + Enter で br タグ が挿入されるようになります。 まとめ 今回のカスタマイズは、HTML ページの設計時にはそれほど必要ではありませんが、コンテンツ自体の更新作業のコーディングとなったとき、よりクリエイティブに集中できるため、重宝される機能だと思います。 Atom をメインでディタとして HTML コーディングを行なっている方は、是非とも導入してみてください。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。
Update!

Xcode: $(SRCROOT) 、$(BUILD_DIR) 等の内容を出力する

Xcode プロジェクトの設定を行う際、ファイルのパス指定に SRCROOT や BUILD_DIR 等の変数が割り当てられているのを目にするかと思います。 今回はこれら Xcode で使われているマクロ変数を出力したいと思います。 目次 $(SRCROOT) 、$(BUILD_DIR) 等の内容を出力する まとめ $(SRCROOT) 、$(BUILD_DIR) 等の内容を出力する プロジェクト > Build Phases を開き、「+」で New Run Script を追加します。 追加された Run Script 項目へ以下の1行を追加し、ビルドを実行します。 ビルド実行後、プロジェクトフォルダ内に env.txt が出力されます。 env.txt には、Xcode で使用されているマクロ変数がすべて出力されています。 まとめ env.txt には、Info.plist や Buid Settings 等以外でも使われている 400 以上のマクロが出力されています。 新規プロジェクト時に、env.txt を Run Script で吐き出しておくと、後々役立つかもしれませんね。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。
eyecatch_image

macOS: こんなとこに… Magic Mouse のスクロールスピードを変更する

先日 Magic Mouse 2 の 2台目をゲットしました。 マウスを新調したら、誰もが使い勝手を細かく設定すると思うのですが、マウススクロール量の設定は少しわかりにくい場所にあるので、今回はマウスのスクロール設定についてメモしておきます。 目次 Magic Mouse のスクロールスピードを変更する まとめ Magic Mouse のスクロールスピードを変更する システム環境設定 を開きます。 この環境設定画面からマウスの設定を行いたい場合、普通の感覚を持ち合わせている方は「マウス」の項目を選択すると思うのですが、スクロールスピードを変更したい場合は「アクセシビリティ」を選択します。 次に アクセシビリティ から マウスとトラックパッド > マウスボタン を選択します。 スクロールの速さ スライダーでスクロール量の調整をします。 ちなみに、スプリングローディングの時間 という項目は、スライダを使用して、項目をフォルダの上にドラッグしてからフォルダが開くまでの時間のことです。 まとめ Magic Mouse 2 は高価ですが、Mac ユーザーがこのマウスにひとたび慣れてしまうと、引き返せなくなってしまいます。 第2世代となってからは、充電方法に問題はあるもののリチウムイオンバッテリーが内蔵されたことで軽量化され、さらに便利に使いやすくなりました。 低価格マウスを何台も試してみるのもいいですが、少々無理して1発目に Magic Mouse 2 を買ったとしても、その対価は十分享受できるとてもよいプロダクトだと思います。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

macOS: Homebrew から zsh インストール等、クリーンインストール後にやること

macOS をクリーンインストール後にやることといえば、Terminal を使った開発環境の構築だと思います。 そのなかでも、まず一番にデフォルトのシェルを zsh に変更する方も多いのではないでしょうか。 今回は Mac ユーザーの開発者であれば(ほぼ)誰もが実行するであろう、macOS クリーンインストール後の一連の作業をメモしておきます。 目次 Atom インストール Homebrew インストール zsh インストール ログインシェルを zsh に変更 不可視ファイルや不可視フォルダを表示 すべてのアプリケーションの実行を許可 Finder を再起動 まとめ Atom インストール https://atom.io から Atom をインストールします。 必ずしもエディタに Atom を利用する必要はありませんが、ここではログインシェル変更時の設定ファイルを書き換える際、vi では分かりづらい(オペレーションをいつも忘れてしまう)ため、 Atom を使用し説明したいと思います。 Homebrew インストール ユーティリティ -> ターミナル.app を起動し、以下のコマンドを実行します。 Terminal.app インストール後、brew doctor で Homebrew に問題がないことを確認しておきます。 Your system is ready to brew. と表示されれば、正常にインストールが完了しています。 zsh インストール Homebrew で zsh をインストールします。 –without-etcdir は Mac が zsh 起動時に PATH リセットするのを回避するためのオプションです。 Terminal.app zsh をインストールする以上 zsh-completions は必須かと思いますので、以下のコマンドを実行します。 ログインシェルを zsh に変更 ターミナルから Atom でログインシェルの設定ファイルを開きます。 Terminal.app 開いた設定ファイルの最下段に、以下の1行を追加しファイルを保存します。 再びターミナルに戻り、ログインシェルの切り替えコマンドを実行します。 ログインシェルが変更されているか確認します。 UserShell: /usr/local/bin/zsh と表示されていれば変更完了です。 不可視ファイルやフォルダ、ライブラリを表示 GUI メインでオペレーションを行う方は、Mac 不可視ファイル表示は必須だと思いますので、以下のコマンドを実行し表示します。 ライブラリフォルダも表示しておきます。 すべてのアプリケーションの実行を許可 以前は、システム環境設定 -> セキュリティとプライバシー の「一般」タブ -> ダウンロードしたアプリケーションの実行許可 より すべてのアプリケーションを許可 にチェックし、サードパーティーアプリをインストールしていましたが、macOS Sierra からはこの項目がデフォルトでは非表示となっています。 この問題は以下のコマンドで解決します。 Finder を再起動 設定を変更したら、Finder を再起動すれば、変更が反映されます。 まとめ マシンのクリーンインストール後にやるべきことはたくさんあります。 今回の説明は Mac を開発メインで利用するユーザーであれば、無視することができない実行項目ばかりだと思いますので、参考にしていただければと思います。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

Swift: WKWebView で 3D Touch を無効にする

iOS 9 から登場した 3D Touch は非常に便利な機能で対応アプリも増えてきていますが、この機能を活用できているユーザーは今のところ少数に思います。 また、Web アプリとなってくるとこの機能が出現すると不都合なときがあり、便利なはずの 3D Touch がユーザビリティを低下させてしまうリスクがあります。 今回は WKWebView でこの 3D Touch を無効にする方法をメモしておきます。 目次 WKWebView で 3D Touch を無効にする まとめ WKWebView で 3D Touch を無効にする WKWebView のデリゲートメソッド shouldPreviewElement で false を返します。 まとめ 3D Touch は デバイス上の物理的な仕組みと連携し機能する iOS 独自のジェスチャーです。 3D Touch 非対応の iOS デバイスユーザーや Android ユーザーにとっては LongPress と混同しがちですが、全く別物です。 このジェスチャーがデファクトスタンダートとなるには時間がかかりそうですが、iOS アプリ開発者は、なるべく今回説明した 3D Touch を無効にする方法ではなく、積極的に導入し利用を促すことが大切だと思います。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

Xcode: Launch Image 変更後、実機で確認できない場合の解決方法

Xcode でアプリにローンチ画像(スプラッシュ)を設定する際、Assets.xcassets で画像を管理しますが、Assets 内の画像変更後にローンチ画像を実機で確認すると、前の画像が表示されるときがあります。 一度こうなると、いくら Mac、Xcode を再起動してもローンチ画像が変更されない状態が続きます。 この現象を解決する方法をメモしておきます。 目次 Launch Image 変更後、実機で確認できない場合の解決方法 まとめ Launch Image 変更後、実機で確認できない場合の解決方法 Assets で画像を変更すれば、厳密には変更内容は反映されています。 この現象は iOS デバイス内に画像キャッシュが残っているため、画像ファイル名をそのまま利用し、データだけを差し替えた場合、キャッシュを参照してしまうことで発生します。 解決方法は以下の通りです。 アプリをロングタップ(長押し)し、アプリを一旦削除します。 iOS デバイスのスリープボタンを長押しして、電源をオフにします。 iOS デバイスの電源をオンにし iOS を起動します。 Xcode からアプリをビルドし、iOS デバイスへアプリを再インストールします。 これで iOS デバイス内にある画像キャッシュがクリアされ、ローンチ画像の変更が確認できます。 まとめ Xcode で開発時に iOS 端末に画像キャッシュが残ってしまい、変更後の確認ができない現象はローンチ画像以外のリソースでも発生します。 せめて開発時には Xcode 上から、これらのキャッシュをクリアする仕組みを準備しておいて欲しいものですね。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

Swift: iOS のバージョン判定を行う

あらかじめ iOS の後方互換を考慮しバージョン判定を使用し、条件に応じて各 OS に対応する機能を振り分ける機会はあるかと思います。 今回は NSFoundationVersionNumber を使用し、フレームワークのバージョンにより判定を行う方法を説明したいと思います。 目次 iOS のバージョン判定を行う まとめ iOS のバージョン判定を行う NSFoundationVersionNumber を利用し、条件を分岐します。 iOS 8.1 以上かどうか (iOS 8.0 以下) の判定 まとめ 今回の方法で判定すれば、システムのバージョンの文字列を取得しキャスト、比較するといった煩雑さもなくなり、可読性もよくなるのでオススメです。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

Xcode: pod setup が先に進まない問題の解決方法

前回の cocoapods インストール の後、pod setup でセットアップを行うと思うのですが、ここでもさらに Setting up CocoaPods master repo から処理が先に進まない問題が発生しました。 今回はこの問題を解決したいと思います。 目次 pod setup が先に進まない問題の解決方法 まとめ pod setup が先に進まない問題の解決方法 インストール完了後に cocoapods のリポジトリフォルダへ移動します。 リポジトリをクローンします。 リポジトリクローン完了後、pod setup を実行します。 Setup completed が表示されればセットアップ完了です。 まとめ cocoapods は一度インストールしてしまえば、ライブラリ・フレームワーク等の更新は pod install 一発で最新のバージョンになり重宝しますが、導入がすんなりいかないのが残念でした。 導入後に問題が発生するケースもあるので、本末転倒ですが従来通り Xcode プロジェクトファイルへマニュアルコピーでもいいような気がします。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

Xcode: cocoapods インストール Operation not permitted エラーを回避

macOS Sierra クリーンインストール後、cocoapods をインストールしようとしたら Operation not permitted エラーが発生し、インストールができませんでした。 El Capitan 以降の OS では、マルウェアからの攻撃に対するセキュリティ強化のため、root 権限にもシステム関連フォルダへのアクセスに制限がかかる(rootless)ようになったのが原因です。 今回はこの問題を解決し、cocoapods をインストールする方法をメモしておきます。 目次 cocoapods インストール時の Operation not permitted エラーを回避する まとめ cocoapods インストール時の Operation not permitted エラーを回避する まず ターミナル.app から普通に cocoapods をインストールしようとします。 すると以下のようなエラーが発生します。 /user 直下への書き込みが制限されているため、cocoapods のインストール先を /usr/local/bin とします。 これで cocoapods のインストールが完了しました。 まとめ セキュリティが強化されることは歓迎ですが、sudo コマンドの万能感がなくなるのは、それはそれで少し不便だったりもします。。 悪質なマルウェアが存在しなければこういうことにはならないのですが、現実世界ではドアに鍵がついているなら、鍵をかけて外出することで、防犯というリスク回避になることと同様、rootless の機能は重要だと感じました。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

siro:chro 無料ゲーム SQN をリリースしました

img_sqn_00

sirochro 初の無料ゲームアプリ SQN をリリースしました。
記事:SQN: iOS 無料ゲームアプリ SQN - Sequential Numbers をリリース
ちょっとした時間に楽しめる完全無料のゲームなっていますので、是非ダウンロードして遊んでみてください。

↓SQN のダウンロードはこちらから