【iOS7】フラットデザインUI実装に役立つライブラリのまとめ

More than 1 year has passed since last update.

iOS7で採用されたフラットデザインっぽいUIを、現行iOS(〜6.x)で実装する際に役立つライブラリ(OSS)をまとめました。後半ではiOS7っぽく下のビューをブラーかけて半透過表示するライブラリや、パララックス表示するライブラリも紹介しています。

FlatUIKit

フラットデザインなUIコンポーネント詰め合わせ。ソースをみると、ほとんどのコンポーネントが該当するUIKitコンポーネントのカテゴリやサブクラスとしてつくってあって、使いやすそうです。

UI7Kit

iOS5, iOS6 で iOS7 の見た目を実現するUIKitのサブクラス集。

iPhone Flat Design UI

フラットデザインのサンプル集的なXcodeプロジェクト。コンポーネント化されて使い回せるわけではありませんが、こう設定すればこういう見た目にできるのか、という参考になります。


QBFlatButton

フラットな見た目にできるUIButtonのサブクラス。

Flat Pill Button

FlatWebView

UIWebViewの後ろのドロップシャドウをなくしたUIWebViewサブクラス。実装をみると、subviewsを辿ってUIImageViewをhiddenにしているようです。

FlatButton

おまけ1:iOS7ぽいビューを実現するUIライブラリ

DKLiveBlur

動的に下のビューをぼかして半透過っぽく表示してくれるビュー。ちゃんとAccelerate.frameworkを使用して実装されてるのでレスポンス面は期待してよさげ。

CFIFrostedOverlayView

上記同様、superviewをブラーをかけて表示してくれるビュー。こっちはGPUImageを使用。

Parallax

パララックス表示するビュー。ただサンプルのアニメーションGIFにあまりパララックス感がないような。。(あとで動かしてみます)

おまけ2:フラットUIデザイン素材

Free iOS 7 UI Kit

Start designing iOS 7 apps today with this comprehensive GUI kit for Photoshop. Absolutely every element you see is 100% vector and completely editable!

Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account log in.