Custom view for iOS development

The view in ios sdk is uiview, so we can easily customize a view.

Create a window-based application program and add a class named hypnosister to it. This class inherits from uiobject. Modify this class to inherit from: uiview

@ Interface hypnosisview:Uiview

The key to customizing a view is to define the drawrect: method, because it is mainly to reload this method to change the view appearance. For example, you can use the following code to draw a view of the effect of many rings.

View code

- (void)drawRect:(CGRect)rect 
{
// What rectangle am I filling?
    CGRect bounds = [self bounds];
// Where is its center?
    CGPoint center;
    center.x = bounds.origin.x + bounds.size.width / 2.0;
    center.y = bounds.origin.y + bounds.size.height / 2.0;
// From the center how far out to a corner?
    float maxRadius = hypot(bounds.size.width, bounds.size.height) / 2.0;
// Get the context being drawn upon
    CGContextRef context = UIGraphicsGetCurrentContext();
// All lines will be drawn 10 points wide
    CGContextSetLineWidth(context, 10);
// Set the stroke color to light gray
    [[UIColor lightGrayColor] setStroke];
// Draw concentric circles from the outside in
    for (float currentRadius = maxRadius; currentRadius > 0; currentRadius -= 20)
    {
        CGContextAddArc(context, center.x, center.y,
                        currentRadius, 0.0, M_PI * 2.0, YES);
        CGContextStrokePath(context);
    }
}

The view effect is as follows:

We can continue to draw something, such as drawing text, and add the following code after this method.

// Create a string
Nsstring * text = @ "I am Zhu Yulin, not Zhu Qilin ";
// Get a font to draw it in
Uifont * font = [uifont boldsystemfontofsize: 28];
// Where am I going to draw it?
Cgrect textrect;
Textrect. size = [text sizewithfont: font];
Textrect. Origin. x = center. X-textrect. Size. width/2.0;
Textrect. Origin. Y = center. Y-textrect. Size. Height/2.0;
// Set the fill color of the current context to black
[[Uicolor blackcolor] setfill];
// Set the shadow to be offset 4 points right, 3 points down,
// Dark gray and with a blur radius of 2 points
Cgsize offset = cgsizemake (4, 3 );
Cgcolorref color = [[uicolor darkgraycolor] cgcolor];
Cgcontextsetshadowwithcolor (context, offset, 2.0, color );
// Draw the string
[Text drawinrect: textrect
Withfont: font];

Effect:

If the view is too large, we can place it in the middle of a uiscrollview, so that we can drag it. The relationship between uiscrollview and view is as follows:

Use the following code to create a view four times larger than the iPhone screen, and then use uiscrollview to display the view. The Code is as follows:

-(Bool) Application :( uiapplication *) Application didfinishlaunchingwitexceptions :( nsdictionary *) launchoptions
{


// Create a cgrect of the form size
Cgrect wholewindow = [[self window] bounds];

// Create a form-sized hypnosisview instance
View = [[hypnosisview alloc] initwithframe: wholewindow];

Uiscrollview * scrollview = [[uiscrollview alloc] initwithframe: wholewindow];
[[Self window] addsubview: scrollview];
// Make your view twice as large as the window
Cgrect reallybigrect;
Reallybigrect. Origin = cgpointzero;
Reallybigrect. Size. width = wholewindow. Size. Width * 2.0;
Reallybigrect. Size. Height = wholewindow. Size. Height * 2.0;
[Scrollview setcontentsize: reallybigrect. Size];
Cgpoint offset;
Offset. x = wholewindow. Size. Width * 0.5;
Offset. Y = wholewindow. Size. Height * 0.5;
[Scrollview setcontentoffset: Offset];

// Create the view
View = [[hypnosisview alloc] initwithframe: reallybigrect];
[View setbackgroundcolor: [uicolor clearcolor];
[Scrollview addsubview: View];
[Scrollview release];
[[Uiapplication sharedapplication] setstatusbarhidden: Yes
Withanimation: uistatusbaranimationfade];
[[Self window] makekeyandvisible];
Return yes;


}

In this way, we can drag to display invisible views, such:

With uiscrollview, we can also set the view scaling function to add the following code. In this way, we can use two fingers to scale the view.

    // Enable zooming
    [scrollView setMinimumZoomScale:0.5];
    [scrollView setMaximumZoomScale:5];
    [scrollView setDelegate:self];

Summary:The text briefly summarizes the use of custom views.

Code: hypnosister.zip