投稿日:

Pinterest風なiPhoneアプリをつくる方法

iPhone

PinterestのようなおしゃれなUIを作るには、UICollectionViewControllerを使います。
これをベースとした、CHTCollectionViewWaterfallLayoutというPinterest風なUIに簡単にしてくれるオープンソースがあるので活用しましょう。

いじるべきなのは、

 //UICollectionViewごとの外側の余白です。htmlでいうところのmarginのような設定
 layout.sectionInset = UIEdgeInsetsMake( 9, 17, 9, 17);

CHTCollectionViewWaterfallLayout.m

 - (void)commonInit {
    _columnCount = 2;
    _itemWidth = この部分。UICollectionViewひとつひとつの横幅;
    _sectionInset = UIEdgeInsetsZero;
 }

注意すべきなのは、UICollectionViewの高さです。
UICollectionViewを表示させるときに高さを計算しても、処理が間に合わずレイアウトがぐちゃぐちゃになります。
あらかじめUICollectionViewのindexごとに、高さを指定した配列をつくっておく必要があります。
表示されるときに、UICollectionViewのIndexに合わせて、配列から高さを取得してあげます。

※このサイトを参考にしましたが、情報がほとんどないので、サンプルコードを見た方がいいかと思います。
http://econa77.hatenablog.com/entry/2013/09/13/012450: http://econa77.hatenablog.com/entry/2013/09/13/012450

Github

投稿日:

Photoshopの画像をDreamWeaverでhtmlファイルに貼り付ける

作業の流れ

1.Photoshopで画像を開き、全選択

2.「編集」メニューの「結合部分をコピー」を選択
　※「結合部分をコピー」を選択する事によって全レイヤーの画像がコピーできる

3.Dreamweaverで、htmlファイルの画像を挿入したい部分にカーソルを持って行き、貼り付け

4.画像の保存画面が出るので、名前を付けて、実際にＷＥＢ上で使用する配置場所に保存

5.3の場所に指定した画像のIMGタグが挿入されていることを確認。

※動作確認環境
Photoshop6.0
Dreamweaver9.0(CS3)

投稿日:

Photoshopで画像の大きさを変更する

Photoshop

Photoshopを使って画像の大きさを変える

　Windows　Photoshop6.0

Adobe　Photoshopを使用して、写真やイラストの画像の大きさを変える

画像全体を引き伸ばしたい場合

  • ツールバーから「イメージ」を選択し、「画像解像度」を選択します。
  • ピクセル寸法か、ドキュメントのサイズのどちらかで変更したい数字を入れてください。
  • 下部の「縦横比を固定」のチェックをONにすると、縦横の比率はそのままで拡大・縮小してくれます。

画像はそのままで、余白などを増やしたい、スペースを増やしたい場合

  • ツールバーから「イメージ」を選択し、「画像サイズ」を選択します。
  • 変更したいサイズを入力します。単位がcmやpxなどで選べます。
  • 下部のアンカーを画面のどこにするか選ぶと、元の画像はどこに配置し、余白をどこに増やすか選べます。
投稿日:

Photoshop　画像の縮小・拡大をすぐ行う

Photoshop

Photoshop　画像の縮小・拡大をすぐ行う

Photoshop CS4

各レイヤー画像の拡大・縮小を行う場合、ふつうの手順だと「編集」→「変形」ですが、いちいちこれを選択するのが面倒な場合、次のような手順で画像の拡大・縮小ができます。

  1. 「移動ツール」を選択
  2. ヘッドメニューに表示される「バウンディングボックスを表示」にチェックを入れる

これで、各画像の境界線である「バウンディングボックス」が常に表示されます。
拡大・縮小したい場合はレイヤーを選択し、画像の周りに表示されるバウンディングボックスをマウスでドラッグするだけです。

投稿日:

Photoshop　あるレイヤーの部分だけ白黒にする

Photoshop

Photoshop　あるレイヤーの部分だけ白黒にする

Photoshop CS4

「レイヤー」→「新規調整レイヤー」→「色相・彩度」を選択し、彩度を調整すると、モノクロになりますが、一部分の色だけ白黒にしたいとか、色を調整したいということもありますよね。
たとえば、下記の画像の雪というレイヤーがピンクなので、これを白にしたい場合、などです。
ps_ss1.png

  1. まず白黒にしたい部分のレイヤーを選択しておきます。ここでは「雪」レイヤーです。
  2. 新しく調整レイヤーを作る時に、そのレイヤーのすぐ上に調整レイヤーを作成します。作成時に「下のレイヤーを使用してクリッピングマスクを作成」というチェックボックスをONにすると、下のレイヤーに存在する部分だけを切り抜いて白黒にできます。レイヤーの状態は、下記のようになります。

ps_ss2.png