Project requirements
Write an iPhone program that displays the text "Hello Word", bold, 26 lbs font size, red font color, black shadow, shadow light source in the upper left corner, 1 pixel offset in the middle of the screen, supports device rotation.
Requirement Analysis
Before we start, let's first analyze the project requirements. This is a very simple project. As long as a piece of "Hello World" text is displayed on the screen, there are also some additional conditions:
- Requirements on font, font color, font size, shadow effect
- Requires text to be displayed in the middle of the screen
- Supports device rotation, and text is displayed in the center of the screen no matter how the device rotates
Based on these requirements, we will gradually implement the process from simple to complex, and divide it into two steps:
- Display text on the screen, set the font and font size, so that the text is displayed in the center of the screen
- Supports device rotation and ensures that the text is still in the center status after rotation.
Product Design
The screen before iPhone 4 is 320x480. By the time it reaches iPhone 4, the screen resolution is 640x960. The iPhone supports four directions of rotation. The horizontal and vertical screen performances are slightly different. Because the project requirements require that screen rotation be supported, the horizontal and vertical screens have different interface performances, A simple prototype design diagram is as follows:
System Analysis and Design
If we do not have development experience in iOS, we need to first read some relevant information to let us know how to develop an iphone program. Apple provides a very detailed and comprehensive website for iOS developers: "iOS Developer Center" at http://developer.apple.com/ios. In the iOS Dev Center, there are all iOS SDK class documents, Getting Started documents, various development guides, sample code libraries, and so on. To develop iOS platform projects, you must always come up with relevant materials. However, it is a pity that at present, the documents and materials for iOS Dev Center are mainly in English and there are few Chinese documents, which is a test for students who cannot read English well.
Now, we will analyze how to implement project requirements from a technical perspective. There are no doubt many technical solutions for the same project. Therefore, we need to set a principle to help us select an appropriate solution. This principle is a simple and practical principle: "We try our best to adopt simple and practical technical solutions, avoid using complicated technical solutions, and waste our time and energy on some flashy techniques." based on this principle, let's start to select technical solutions for project requirements:
Display text of a specific font and size on the screen
To display texts of a specific font and size on the screen, we need to first check whether the iOS SDK provides a simple and practical way to display the text. In the iOS Dev Center, there is an article "iOS Human Interface Guidelines", which specifically explains the knowledge of the user Interface in iOS. From this article, we can systematically understand the composition of the iOS Interface and various basic Interface elements, according to the instructions, we can find that the UILabel control is the most suitable control for our project needs. Of course, there are also complicated technical solutions, that is, the method of self-painting on the interface, based on the simple and practical principle, we can use the UILabel iOS built-in control.
Before using UILabel, we need to first learn about the UILabel control and find "UILabel Class Reference" in iOS Dev Center ", we can see the introduction of UILabel and detailed descriptions of all attributes and methods.
The document is quite comprehensive, but for us, the key is to get project-related information. From the document, we can find the relevant attributes we need to display text one by one:
- Text: The text displayed by the Label. The type is NSString, that is, "Hello World" to be displayed in the project requirement ".
- TextAlignment: The mode of text in the Label. The type is UITextAlignment enumeration. In this project requirement, the text must be displayed in the middle of the screen, and the corresponding property value is UITextAlignmentCenter.
- Font: Text font and size, type UIFont class, that is, the requirements of this project: "The font is bold, the font size is 26 lbs", the corresponding code is:[UIFontBoldSystemFontOfSize:26].
- TextColor: Text color, type: UIColor class, that is, the requirement of this project: "font color red", corresponding code:[UIColorRedColor].
- ShadowColor: The shadow color of the Label text, type: UIColor class, that is, the requirement of this project: "Black Shadow", corresponding code:[UIColorBlackColor].
- ShadowOffset: The offset direction and offset of the Label text shadow. The type is CGSize, which is required in this project: "The Shadow light source is in the upper left corner and the offset is 1 pixel." The corresponding code is:[CGSizeMake (1,1)].
Display text in the center of the screen
To display the text in the center of the screen, we should first set the UILabel-related attributes to achieve the goal. If the UILabel-related attributes are not supported, then we must calculate the coordinates of UILabel based on the size of UILabel and the screen size, so that the text is displayed in the center of the screen. In the UILabel document, we did not find any property to set its coordinates or its attributes. Does this mean that UILabel does not support it? Do not ignore a problem. The programming language used by iOS is Objective-C. This is similar to the C language that supports object-oriented features. An important feature of object-oriented features is inheritance, for the UILabel class, it has a parent class, that is, the attributes supported by the UILabel parent class. UILabel is supported. on the homepage of the UILabel document, we can see that UILabel is inherited from UIView, so we can link to the "html % 23/apple_ref/doc/uid/TP40006816"> UIView Class Reference "document.
From the document, we can find two important attributes to display text in the middle of the screen:
- Frame: The location and size attributes of the Label. The type is CGRect. In this project requirement, the size value of the frame attribute of the Label control must be displayed in the middle of the screen, the x and y coordinates are calculated based on the size of the main interface to ensure that the Label is displayed in the center of the screen.
- AutoresizingMask: This attribute indicates how the widget automatically adjusts its size or the top, bottom, and left margins when its parent container size changes.
Supports screen Rotation
By default, the iPhone does not support screen rotation. How can I make the interface support rotation? In the iOS Dev Center, you can find "View Controller Programming Guide for iOS". In the "m View Controllers" section, you can refer to the section "management a View Controllers Interface Orientation ", explains how to enable device rotation on your iOS interface:
- Override the "shouldAutorotateToInterfaceOrientation:" method of the corresponding View Controller and declare the supported direction in the method.
- Configure the autoresizingMask attribute of the View in the corresponding View Controller to adapt to layout changes caused by PAGE rotation. In this project, the device must be rotated to ensure that the text is centered. With this attribute, the width and height of the form can be changed after the page is rotated, UILabel can still be centered.