UI介面 UIImage的拉伸

2021-07-06 04:19:36 字數 1575 閱讀 4868

原文

uiimage主要是用來設定uiimageview中的image屬性的。如果尺寸和uiimageview的尺寸正好一樣。那麼,恭喜您,直接放上去就ok了。

但是,如果兩個尺寸不相匹配怎麼辦呢?答案很明顯有兩種:拉伸或者保持原來大小不變。

一、不拉伸

如果你不想拉伸,那麼伴隨著乙個問題。這個image應該放在**合適?

這時,uiimageview會用到從父類uiview繼承過來的乙個屬性contentmode。

如果這樣寫:

imageview.contentmode = uiviewcontentmodecenter;//假設imageview存在,並且已經設定過了乙個尺寸較小的

這句**執行後,可以看到會顯示在imageview的**。其它的列舉值效果,大家可以自己去嘗試。

二、拉伸

如果拉伸,那麼伴隨的將是另外乙個問題,該如果拉伸?

1>均勻拉伸

均勻拉伸分為兩種:等比例拉伸或者非等比例拉伸

如果選擇等比例拉伸,那麼可能必然只能以一邊外參照,另一邊就無法考慮到。

這時,也會用到上面說的contentmode屬性。

imageview.contentmode = uiviewcontentmodescaleaspectfit;//假設imageview存在,並且已經設定過了乙個尺寸較小的

imageview.contentmode = uiviewcontentmodescaleaspectfill;//假設imageview存在,並且已經設定過了乙個尺寸較小的

上面**第一種,執行的效果是,水平方向和垂直方向等比例拉伸。當某一邊達到最大效果時,停止拉伸,並顯示出來。

下面**,執行的效果是,水平方向和垂直方向等比例拉伸。當某一邊達到最大效果時,如果另一邊還沒有達到最大效果,繼續拉伸,並且已經達到最大效果的方向會繼續拉伸,超過imageview的邊界。

如果是非等比拉伸,那麼就不需要考慮那麼多問題了。

imageview.contentmode = uiviewcontentmodescaletofill;//假設imageview存在,並且已經設定過了乙個尺寸較小的

這句**會直接將拉伸到填充這個imageview。

2>非均勻拉伸

在這裡只考慮一種情況。就是保持的邊界不變,只拉伸中間的一部分。

如果是ios5.0以前,可以有兩個選擇。不過第一種已經宣告過時,不推薦使用。

[image stretchableimagewithleftcapwith:7 topcapheight:8];//假設image已經存在,並且其大小為17*31

[image resizableimagewithcapinsets:[uiedgeinsetsmake(8, 7, 22, 9)]];//假設image已經存在,並且其大小為15*15

上面**第一種,意思是說,如果水平方向需要拉伸,那麼保持左邊7個畫素不變,保持右邊(17 - 7 - 1)個畫素不變,拉伸的是從第7個畫素開始的乙個畫素長度;如果是垂直方向需要拉伸,那麼保持上邊8個畫素不變,保持下邊(31-8-1)個畫素不變,拉伸的是從第8個畫素開始的乙個畫素長度。

下面**,所做的效果和上面的一樣。

l

更新UI介面

在同乙個ui介面中可能包含有 文字 文字框 進度條等多種控制項,如何在保持分布比例的基礎上將各元素排布的僅僅有條,這裡主要使用到grid布局。grid布局是wpf中一種非常常用的 布局,它可以將整個介面劃分為規則的幾行幾列,也可以單獨將其中一行劃分為需要的列數。介面中使用的控制項可以單獨位於乙個網格...

spark的UI介面解析

1 代表job頁面,在裡面可以看到當前應用分析出來的所有任務,以及所有的excutors中action的執行時間。頁可以分為兩部分,一部分是event timeline,另一部分是進行中和完成的job任務。第一部分event timeline展開後,可以看到executor建立的時間點,以及某個ac...

介面UI測試的方法

早期進行過一次針對測試零基礎在校學生進行的分享,一堂課學會做介面測試。然後結合這個找茬的過程分享下介面測試的概念和方法。介面測試 簡稱ui測試,測試功能模組介面上看到的所有元素 包括空文字 控制項等 顏色風格是否統一,布局是否合理 美觀,符合使用者習慣等等。接下來介紹一下移動端介面測試的詳細內容。文...