318
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

updated at

Organization

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

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!

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
318
Help us understand the problem. What are the problem?