• <tbody id="9brb1"><pre id="9brb1"></pre></tbody>

    <em id="9brb1"></em>

  • <th id="9brb1"></th>

  • <tbody id="9brb1"><pre id="9brb1"></pre></tbody>
  • <button id="9brb1"><acronym id="9brb1"><input id="9brb1"></input></acronym></button>
      <tbody id="9brb1"><pre id="9brb1"></pre></tbody>
        更多課程 選擇中心


        UI培訓

        400-111-8989

        達內UI培訓PS基礎教程-25-圖層對齊

        • 發布:達內
        • 來源:達內
        • 時間:2017-12-06 15:30

        選擇需要進行對齊的兩個眼睛層,頂部公共欄中就會出現對齊方式的選擇(在使用移動工具前提下,其它工具不會出現此選項)。如下右圖所示。前面6個按鈕功能分別是:頂對齊、垂直居中對齊、底對齊、左對齊、水平居中對齊、右對齊。我們只要按前面三個水平方式的任何一個按鈕都可以完成對齊了。

        達內UI培訓PS基礎教程-25-圖層對齊

        那么這三個按鈕的區別何在呢?其實它們是依據圖層中像素的面積大小來安排對齊方式的。由于我們這里的兩個眼睛層的像素面積是相同的,所以看不出區別。為了讓效果明顯,我們將左邊的眼睛縮小一些并更改顏色。
        0528確保正確選擇了圖層的情況下,使用移動工具〖V〗,在頂部公共欄開啟“顯示變換控件”選項(下左圖紅色箭頭處),此時眼睛周圍會出現調整框。在4個綠色箭頭所指處按下鼠標拖動即可調整眼睛層像素內容的大小。調整的時候同時按住SHIFT鍵可保持此時的長寬比例不變,避免將正圓調整成橢圓。在調整的時候頂部公共欄將會出現相應的信息值,如下右圖,觀察其中的W和H百分比,即是我們調整圖層內容大小的長寬比例。將其調整為約55%,按下回車鍵完成變換。注意如果開啟了“保持長寬比”選項(如下右圖紅色箭頭處),那么就相當于按住SHIFT鍵。
        在實際使用中類似的操作大都使用自由變換命令來完成,且功能更齊全,而移動工具的這個附加變換選項不僅功能少,還容易造成誤操作,實用價值不大,建議不要使用。

        達內UI培訓PS基礎教程-25-圖層對齊

        在縮小了一只眼睛后,我們再將另外一只眼睛的顏色改變一下,在確保正確選擇了圖層的前提下,使用色相/飽和度〖CTRL U〗,將色相隨便調整到一個數值(如下左圖是調整為+50的效果)。
        0529這個時候我們再分別使用前面三個對齊的選項,就會看到區別了。如下右圖所示,可以看出,這三種排列方式是以各圖層中圖像的Y軸長短為標準的,形象的說就是以高矮為標準的。由于Y軸是垂直的方向,因此這三種對齊方式的名稱實際上都應以垂直開頭,稱為:垂直居頂、垂直居中、垂直居底。當然,我們還是要以Photoshop中的說法為準。即頂對齊、垂直中齊和底對齊。
        形象地說,頂對齊相當于幾個氣球飄到房頂,無論氣球大小,停留的高度就是房頂的高度。垂直中齊相當于穿山楂串,每個山楂無論大小都從中間穿過。底對齊相當于合影照相,無論誰高誰矮都站在地面上。

        達內UI培訓PS基礎教程-25-圖層對齊

        為什么不介紹左對齊、水平中齊、右對齊的效果呢?大家把書本或者顯示器旋轉90度再看上右圖就可以了。

        有沒有想到一個問題:既然是對齊,那么誰和誰對齊呢?換句話說,是小眼睛對齊大眼睛,還是大眼睛對齊小眼睛?這兩者咋看起來沒有區別,可是這牽涉到一個移動的問題,既然是對齊,實際上就是一種自動移動圖層的操作,那究竟是小眼睛移動去對齊大眼睛,還是大眼睛移動去對齊小眼睛呢?
        我們在排隊的時候,隨著一聲“向右看齊”!,每一行都以最右邊的一個人作為基準進行排列。這里的圖層對齊也要有個基準層。基準層保持保持不動,其他圖層參照基準層進行移動。那如何確定誰是基準層呢?這要分開2種情況來說。
        0530一是同時選擇多個圖層的情況下(無論這些層是否被鏈接),圖層調板類似下第1圖或下第2圖。向上看齊(即頂對齊)就以原先位于最頂部(僅限于所選擇的圖層中)的圖層為基準層,那么向下看齊(即底對齊)就是以原先位于最底部的層為基準層。垂直中齊則兩個(或多個)圖層同時向中心位置移動。如下第3圖所示。
        二是鏈接了多個圖層,但只選擇了其中某一層,圖層調板類似下第4圖,那么對齊的基準層就是以這個被選擇層(即“eye”層)為準。

        達內UI培訓PS基礎教程-25-圖層對齊

        確定好基準層是很重要的,否則對齊的效果會有重大差別。另外,雖然對齊操作可能會涉及到多個圖層的移動,但在歷史記錄中只算作一步。

        我們看到排列對齊的按鈕有12個。可是我們現在只能選擇前面6個,后面6個無法使用,這是為什么?這是因為后面那6種屬于分布方式,必須有三個以上的層鏈接才有效。大家可以自己先試試看,我們將在以后的實例中學習使用。

        Photoshop提供了智能參考線(CS及更早版本不具備),這是一種根據圖層內容自動判斷對齊方式的功能,非常實用。下面我們來學習如何使用它。
        0531首先要確保對齊功能開啟【視圖 對齊】〖CTRL SHIFT ;〗,并且【視圖 對齊到 參考線】有效,這樣就可以使用智能參考線的對齊功能了。為了更好地觀看對齊效果,特別是在圖像中內容繁多的時候準確判斷對齊的對象和方式,應同時開啟【視圖 顯示 智能參考線】。智能參考線默認為洋紅色,可從Photoshop首選項的“參考線、網格和切片”項目〖CTRL K,CTRL 6〗中更改。需要注意的是,即使沒有開啟智能參考線的顯示,它的對齊功能也仍然有效。

        0532現在我們分析一下智能參考線的原理,它實際上就是找出圖層內容的邊界和中心,將每個圖層內容以橫豎各3條共9條隱形線貫穿形成。以下左圖的例子來說,圖層最頂部就是X1,最底部是X3,最左側是Y1,最右側是Y3,由X2和Y2共同形成的就是圖層中心點。這樣在移動過程中,Photoshop自動對比所有圖層中這9條隱形線,并互相對齊。對齊的表現就和我們以前建立過的普通參考線一樣,在靠近相應位置一定距離時會產生吸附效果。
        以兩個圖層對齊來說,在X方向上就有9種對齊的可能性,即第一圖層的X1、X2、X3分別與第二圖層的X1、X2、X3對齊。加上Y方向上同樣數量的9種可能性,共構成了81種對齊方式。如下中圖演示了其中3種X和Y同時對齊的情況。灰色線條為圖層各自的隱形參考線,黑色線為產生對齊效果的參考線。
        明白了智能參考線的原理后,它的使用就不再神秘,在移動圖層的過程中如果這9條線之間有對齊情況出現,那么所對齊部分的參考線就會自動出現,如下右圖。

        達內UI培訓PS基礎教程-25-圖層對齊

        除了可以在移動圖層時提供參照之外,在創建選區的時候智能參考線也可以發揮作用,原理其實就是將選區也看作是一個有內容的圖層來參與對齊。如下2圖是在創建選區時出現的參考線,下左圖表示選區的Y2線與正圓的Y2線及其下方圖層的Y1線對齊,下右圖則表示選區的X2線與正圓的X3線及其下方圖層的X1線對齊。
        此外,在使用裁切工具及切片工具的時候也可以使用智能參考線。

        達內UI培訓PS基礎教程-25-圖層對齊

        預約申請免費試聽課

        填寫下面表單即可預約申請免費試聽!怕錢不夠?可就業掙錢后再付學費! 怕學不會?助教全程陪讀,隨時解惑!擔心就業?一地學習,可全國推薦就業!

        上一篇:達內UI培訓PS基礎教程-24-圖層鏈接
        下一篇:達內UI培訓PS基礎教程-26-合并圖層

        達內UI設計7月免費訓練營報名啦

        UI培訓教程之系統圖標如何設計

        月薪過萬的UI設計師都是怎么設計界面的

        達內設計學院九周年慶典回首來時路,共赴新征程

        • 掃碼領取資料

          回復關鍵字:視頻資料

          免費領取 達內課程視頻學習資料

        • 視頻學習QQ群

          添加QQ群:1143617948

          免費領取達內課程視頻學習資料

        Copyright ? 2021 Tedu.cn All Rights Reserved 京ICP備08000853號-56 京公網安備 11010802029508號 達內時代科技集團有限公司 版權所有

        選擇城市和中心
        貴州省

        廣西省

        海南省

        2019最新在线国产自拍,2019最新国产在线观看_久久爱久久高清视频 百度 好搜 搜狗
        <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <文本链> <文本链> <文本链> <文本链> <文本链> <文本链>