Please enable JavaScript.
Coggle requires JavaScript to display documents.
Swift 基礎 (First User Interface (「Aspect Fit」 will increase the image size…
Swift 基礎
First User Interface
「Aspect Fit」 will increase the image size (maintaining the aspect ratio) to the maximum size that will fit inside the image view.
「寬高比」會將圖像尺寸(保持寬高比)增加到適合圖像視圖內部的最大尺寸。
「Aspect Fill 」will increase the image size (maintaining the aspect ratio) until the entire image view sill is filled up. This may result in some clipping of the image if the aspect ratio of the image and image view are different.
寬高比填充將增加圖像大小(保持寬高比),直到填滿整個圖像窗台。 如果圖像的縱橫比和圖像視圖的寬高比不同,則可能會導致圖像出現某些剪裁。
-
All the various screen sizes of iOS devices fit into one of several categories called「 Size Classes」.
The default is "Scale to Fill" which will stretch the image so that it fills up the entire image view.
默認值為“縮放以填充”,它將拉伸圖像,使其填滿整個圖像視圖。
Size Classes are defined by a height and a width. The width and height can be either: 「Regular, Compact or Any」
The UIImageView element has a property called "Content Mode" which lets you change how the image is displayed inside.
UIImageView元素具有一個稱為“內容模式”的屬性,該屬性使您可以更改圖像在內部的顯示方式。
For example the Size Class "Any Width, Any Height" (denoted by "wAny, hAny") includes all screen sizes and all orientations.
When you're adding a new Auto Layout constraint, you'll see a checkbox to "Constrain to Margins". If this is enabled, you constraint will respect the margins.
添加新的“自動佈局”約束時,您會看到“約束到邊距”複選框。如果啟用此選項,則約束將遵守邊距。
Another example, the size Class "Compact Width, Compact Height" (wC , hC) is the smallest size class.
The margins are something that you can customize for your app and they just help you keep your elements within certain distance from the edges. There's a default amount of left/right margin.
邊距是可以為應用程序自定義的內容,它們僅可幫助您將元素與邊緣保持在一定距離內。 有默認的左右邊距量。
Size Classes exist so that you can fine tune your user interface for various screen sizes and orientations.
可以針對各種屏幕尺寸和方向微調您的用戶界面。
By default when you specify positioning constrains for your elements, it'll be within the Safe Area. You have to manually open the dropdown and select "View" instead of Safe Area if you want your element to fall outside of the Safe Area (you'd want to do this for a full screen background, for example).
默認情況下,當您為元素指定定位約束時,它將位於“安全區域”內。 如果您希望元素不在安全區域之內,則必須手動打開下拉選單,然後選擇“View”而不是“Safe Area”(例如,要在全屏背景下執行此操作)。
By default when you add elements onto your view and when you add auto layout constraints, you're adding them to the "Any Width , Any Height" (wAny, hAny) size class.
默認情況下,將元素添加到視圖中時以及添加自動佈局約束時,會將它們添加到“任何寬度,任何高度”(wAny,hAny)大小類中。
Safe area is the space that is guaranteed to be unobstructed by things like the "notch" or the rounded corners on the iPhone X series. If you place your elements within the "safe area", you can be sure they won't be covered by things such as the battery indicator, time etc.
安全區域是保證不受iPhone X系列上的“缺口”或圓角之類的東西阻礙的空間。 如果將元素放置在“安全區域”內,則可以確保它們不會被電池指示器,時間等遮蓋。
You can specifically add/remove elements and constraints for certain Size Classes. These are called Variations.
您可以專門為某些大小類添加/刪除元素和約束。 這些稱為變動。
As you're laying out your user interface, you'll come across two terms: Safe Area and Margins.
在佈置用戶界面時,您會遇到兩個術語:“安全區域”和“邊距”。
Connecting Elements
If you're using Interface Builder, then you need to be able to access the objects you're configuring in your storyboard from the ViewController.swift file since the ViewController is supposed to be managing the view.
如果您使用的是Interface Builder,則必須能夠從ViewController.swift文件訪問在情節提要中配置的對象,因為ViewController應該在管理視圖。
You can do this with IBOutlet properties which is simply a property in the class that references an object in your storyboard.
您可以使用IBOutlet屬性來執行此操作,該屬性只是類中引用情節提要中的對象屬性。
You can actually create all of your user interface programmatically by using Swift code to create new objects, set their properties using dot notation and then putting them into the view.
實際上,您可以使用Swift代碼創建新對象,使用點表示法設置其屬性,然後將其放入視圖中,從而以編程方式創建所有用戶界面。
The easiest way to make this connection is to open up Assistant Editor, display your storyboard on the left while your ViewController.swift file is on the right. Then hold down CTRL and click and drag a line from the element you want to connect over to the right side where you would specify a property for the ViewController class.
建立此連接的最簡單方法是打開助手編輯器,在您的ViewController.swift文件在右側的同時,在左側顯示情節提要。 然後,按住CTRL鍵,然後從要連接的元素上單擊並拖動一條線到右側,您將在其中為ViewController類指定屬性。
So the storyboard is a giant visual builder that makes it easier for you to construct your user interface.
There's an offical name for this visual builder: Interface Builder.
因此,故事板是一個巨大的視覺生成器,可讓您更輕鬆地構建用戶界面。
該視覺生成器有一個正式名稱:Interface Builder。
You'll see a dialog menu pop up and you can name your IBOutlet. Afterwards, an IBOutlet property will be created for that class.
您會看到一個彈出的對話框選單,您可以命名IBOutlet。 之後,將為該類創建IBOutlet屬性。
When you're configuring an element in your storyboard by setting its properties through the right hand pane(utiliy pane/attribute inspector), you're actually configuring the properties of that object.
當透過右窗格(實用程序窗格/屬性檢查器)設置故事板中的元素來配置元素時,實際上是在配置該對象的屬性。
If you need to change the IBOutlet property name, make sure you break the connection by going to your storyboard, right-clicking (or CTRL clicking) the element to open up its connections dialog, then clicking the "x" beside the IBOutlet connection.
如果需要更改IBOutlet屬性名稱,請透過轉到情節提要,右鍵單擊(或CTRL單擊)該元素以打開其連接對話框,然後單擊IBOutlet連接旁邊的“ x”,以確保斷開連接。
The UIKit library is provided by Apple and it has many useful classes for app development including basic user interface elements, navigation controllers and more.
UIKit庫由Apple提供,它可用於許多應用程式開發,包括基本的用戶界面元素,導航控制器等。
IBAction functions are methods in your class that are attached to events generated by your storyboard user interface elements.
IBAction函數是類中的方法,這些方法附加到情節提要用戶界面元素生成的事件上。
For example, the button element in your storyboard is an instance of the UIButton class in UIKit.
button元素是UIKit中的UIButton類的實例。
They're connected in the same way IBOutlet properties are except that you choose "Action" for the connection typ.
它們的連接方式與IBOutlet屬性的連接方式相同,只是您為連接類型選擇了“動作”。
The elements you've been adding to the Xcode Storyboard repesent objects of classes that are in the UIkit library
Start Here
-
-
-
-
When you reassign your variable, you don't have to redeclare it
當您重新分配變數時,無需重新宣告它
When you reasson data to a variable, it must be the same type as the initial data type
將數據重新分配給變數時,它必須與初始數據類型相同
Once assigned, Constants can't be reassigned data
一旦分配了常數(let),就無法重新分配數據
Constants are useful to keep track of data that you need but you don't expect to change
常數對於追蹤所需的數據很有用,但是你不預期更改
-
重點整理
-
Use Camel Case as a best practice for naming your variables and constants.
使用Camel Case作為命名變數和常數的最佳名稱。
Use the "var" and "let" keywords to declare new variables and constants.
使用"var" 和 "let" 關鍵字來宣告新的變數與常數
Constants are like variables but you can't reassign data to them after the initial assignment.
常數就像變數一樣,但是您不能在初始分配後將數據重新分配給它們。
-
User Interaction (使用者互動)
-
The UIImage class has a special method where you can pass in an input parameter while creating the UIImage object. This parameter points to an image asset in your Xcode asset library.
UIImage類有一個特殊的方法,您可以在其中創建UIImage對象時傳入輸入參數。 此參數指向Xcode資產庫中的圖像資產。
-
So if we want to create a UIImage object that represents the data for one of our image assets, we can pass in the asset name like this:
因此,如果我們要創建一個UIImage對象來代表我們其中一項圖像資產的數據,則可以像這樣傳遞資產名稱:
-
In order to do this via code, the UIImageView.image property expects you to assign a UIImage object to it
為了透過代碼執行此操作,UIImageView.image屬性要求您為其分配一個UIImage對象。
Then we can set the image property with that newly created UIImage object.
然後,我們可以使用該新創建的UIImage對象設置image屬性。
-
You can set the image displayed within a UIImageView element by setting its "image" property.
您可以通過設置UIImageView元素的“ image”屬性來設置其顯示的圖像。
-
UI Stack Views
The Stack View element has properties for you to configure spacing and alignment of the elements inside of it
Stack View元素具有用於配置其內部元素的間距和對齊方式的屬性
The Axis property of the Stack View determines if the elements are arranged vertically or horizontally.
堆疊視圖的Axis屬性確定元素是垂直排列還是水平排列。
Its purpose is to arrange the elements inside of it either side by side horizontally or vertically, one on top of another.
其目的是將其中的元素水平或垂直地並排排列,一個在另一個的頂部。
The Distribution property determines how much space to give/allocate to each element inside of it
Distribution屬性確定要為其分配/分配給其中每個元素的空間量
Stack Views are a user interface elements that acts like a container for other elements.
堆疊視圖是一個用戶界面元素,其作用類似於包含其他元素的容器。
-
-
-
Functions(Part1)
A block of code with a give name that can be executed on demand by calling that name
帶有給定名稱的代碼區塊,可以通過該名稱來執行呼叫功能
-
-
Variables and constants created inside a function are only accessible inside that function.
在函數內部創建的變數和常數只能在該函數內部執行。
Optionals
An optional data type allows "nil" to be a value for that varible or constant.
可選的數據類型允許“ nil”是該變數或常數的值
You should always check if an optional contains nil or not before trying to use it
在嘗試使用可選選項之前,應始終檢查其是否包含nil
Before you can access the object of an optional variable or constant, you must first "unwrap" the optional
在訪問可選變數或常數的對象之前,必須先“解開”可選變量,用“!"方式
-
-
-
Loops (Part2)
-
repeat......while...
Repeat-While Loop runs the code FIRST and then checks the condition for looping
先執行運行一次代碼區,後看條件是否成立在繼續執行
-
-
-
-
-
-
-
-
-
Loops(part1)
for.....in(範圍)....
-
Each time your code loops, it is called an iteration of the loop
每次您的代碼循環時,這稱為循環的迭代
Classes
Classes and Objects
A class definition is like a template or blueprint, When you create an actual tangible instance of the class, that instance is called an "object"
類定義就像模板或藍圖,當您創建類的實際有形實例時,該實例稱為“對象”
UI Kit
NSObject
NS:NextStep, Steve Job's second company after being removed from Apple
下一步,史蒂夫·喬布斯(Steve Jobs)從蘋果公司撤職後成為第二家公司
-
Dictionaries
Tuple: A tuple type is a comma-separated list of types, enclosed in paraentheses.
元組:元組類型是用逗號分隔的類型列表,用括號括起來。(key , value)
-
Auto Layout
Key Concepts(關鍵概念)
Today, the coordinate system is still in place although we size and position elements using Auto Layout Constraints
今天,儘管我們使用“自動佈局約束”來調整元素的大小和位置,但坐標系仍然存在
A constraint is a rule that dictates how an element is sized or positions relative to another element.
約束是一個規則,它決定元素的大小或相對於另一個元素的位置。
The X,Y Width and Height values for an element is referred to as the "Frame" of that element.
元素的X,Y寬度和高度值稱為該元素的“框架”。
For example, if we want to make sure that two elements are both left aligned, we can add a Constraint saying: Element A's left property should be equal to Element B's left property.
例如,如果我們要確保兩個元素都靠左對齊,則可以添加一個約束條件:元素A的left屬性應等於元素B的left屬性。
-
You can add new constraints with these two buttons in Interface Builer.
您可以使用Interface Builder中的這兩個按鈕添加新的約束。
-
The auto layout system will position and size elements by trying to satisfy all of the Constraints you've specified.
自動佈局系統將通過嘗試滿足您指定的所有約束條件來定位和調整元素的大小
Before auto layout, elements were laid out using an X,Y coordinate system with the origin(0,0) being the upper left corner
在自動佈局之前,使用X,Y坐標係對元素進行佈局,其原點(0,0)為左上角
Sometimes you will end up in a situation where the auto layout system can't find a way to satisfy all of the Constraints. In this case, the system will automatically break one of the Constraints which can lead to unintended consequences to your layout
有時您會遇到無法自動佈局的方法來滿足所有約束的情況。 在這種情況下,系統將自動突破其中一個約束條件,這可能會給您的佈局帶來意想不到的後果
-
If you have conflicting Constraints, Xcode will show you and give you some hints on how to solve it.
如果您有衝突的約束,Xcode將向您顯示並給您一些有關如何解決它的提示。
-
-
-
-