IOS development uses Picker View to implement an App for Image Browsing

IOS development uses Picker View to implement an App for Image Browsing

Today, we will make a simple selection through the Picker View control, and then display the image App on another interface. The main module consists of two parts: the use of the Picker View control and data transmission between the two interfaces.

(1) drag a Picker View Control (a bit like Date Picker) in the first interface to scroll and select the image name; drag an ImageView In the second interface. it is used to display different images based on the data passed in on the first interface. The interface layout is as follows:

.

 

(2) drag several photos to images. xcassets for display. This article uses five photos.

(3) create an array for the text to be displayed in the Picker View in ViewController. swift, as shown below:

.

 

(3) create a new swift file, which is used as an extension of ViewController. swift on the first interface to implement the Protocol of two Picker views (which can be understood as an implementation interface ). The two protocols are UIPickerViewDataSource and UIPickerViewDelegate. The Code is as follows:

.

 

(4) bind the Picker View control to the Code, and bind the data source and Proxy just implemented in viewDidLoad;

.

 

(5) After completing the above steps, run the program and find that the Picker View can be used normally and the text in the array can be displayed;

.

 

(6) data must be transferred during page Jump. The prepareForSegue method is used. You can specify the Identifier of the Storyboard Segue as "GoToGallery ". Why must I specify Identifier. Because the same interface may have to jump to multiple different interfaces, there will be different sews. The method is as follows:

 

    override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {            if segue.identifier == GoToGallery{                    let index = picPicker.selectedRowInComponent(0)                        var imageName:String?            switch index{                        case 0:                imageName = gugong                break                            case 1:                imageName = tiantan                break                            case 2:                imageName = shuilifang                break                            case 3:                imageName = niaochao                break                            case 4:                imageName = tiananmen                break                            default :                imageName = nil            }                        var vc = segue.destinationViewController as! GalleryViewController            vc.imageName = imageName                    }//if;    }//prepareForSegue();

(7) How can I obtain it on the second interface? Declare a global variable imageName and display the image according to this imageName. The implementation code is as follows:

 

.

 

(8) after the above steps, the effect is as follows:

.

 

.

 

.

 

.

 

The code for several important classes is attached below:

ViewController. swift:

 

Import UIKitclass ViewController: UIViewController {@ IBOutlet weak var picPicker: UIPickerView! Let pic = [Forbidden City, Tiantan, Water Cube, nest, Tiananmen Square] override func viewDidLoad () {super. viewDidLoad () picPicker. dataSource = self picPicker. delegate = self} override func didReceiveMemoryWarning () {super. didReceiveMemoryWarning () // Dispose of any resources that can be recreated .} override func prepareForSegue (segue: UIStoryboardSegue, sender: AnyObject ?) {If segue. identifier = GoToGallery {let index = picPicker. selectedRowInComponent (0) var imageName: String? Switch index {case 0: imageName = gugong break case 1: imageName = tiantan break case 2: imageName = shuilifang break case 3: imageName = niaochao break case 4: imageName = tiananmen break default: imageName = nil} var vc = segue. destinationViewController! GalleryViewController vc. imageName = imageName} // if;} // prepareForSegue (); // Unwind Segue @ IBAction func close (segue: UIStoryboardSegue) {print (closed) }// ViewController ()

 

GalleryViewController. swift:

 

import UIKitclass GalleryViewController: UIViewController {        @IBOutlet weak var beautyImage: UIImageView!        var imageName:String?    override func viewDidLoad() {        super.viewDidLoad()        if imageName != nil{                    beautyImage.image = UIImage(named: imageName!)        }            }    override func didReceiveMemoryWarning() {        super.didReceiveMemoryWarning()        // Dispose of any resources that can be recreated.    }    }

ViewControllerExtension. swift:

 

 

Import UIKit // create ViewControllerExtension. swift, as the extension of ViewController on the first page; extension ViewController: UIPickerViewDataSource {func Preview (pickerView: UIPickerView)-> Int {return 1} func pickerView (pickerView: UIPickerView, component: int)-> Int {return pic. count} extension ViewController: UIPickerViewDelegate {func pickerView (pickerView: UIPickerView, TitleForRow row: Int, forComponent component: Int)-> String! {Return pic [row]}