#### What Will I Learn?
- You will learn how to integrate Steem-api's in swift programming language.
- You will learn more on how to store data in arrays and dictionaries.
- You will learn how to pass data between two view controllers.
- You will learn how to design on storyboard.

#### Requirements
- Xcode
- Basic Understanding of Xcode.
- Understanding of swift language in iOS development.
- Understanding of arrays and dictionaries in swift.
- Understanding of segues in swift.

#### Difficulty
- Basic

#### Tutorial Contents
![xcode.gif](https://res.cloudinary.com/hpiynhbhq/image/upload/v1520482350/d9sth6dkkc0cbto5vz7r.gif)

Welcome back guys to fourth part of our awesome iOS app tutorial. In last part we learn how to pass data from one view controller to another view controller, we make a user profile screen to show details of user steemit account. Today in Part 4 of our tutorial we gonna create and design a new screen which is user wallet details screen. Ok let's start our tutorial by dragging a new view controller on <code>main.storyboard</code> like this :-
![xcode.gif](https://res.cloudinary.com/hpiynhbhq/image/upload/v1520478420/uz8dxemglawntwl4e5ro.gif)

- Now create a new cocoa touch file and name it <code>userWalletVc</code> and after creating the file, go to your storyboard and set that file as your new viewController class.
- Ok now we have view controller and its class to write code, now we gonna first design our viewController by adding some background colour and labels to it like this :-

![Screen Shot 2018-03-08 at 8.51.35 AM.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1520479344/ektk1mxmekj82b9ofvoj.png)

- So what we did here is we drag 6 label on view, 3 labels to left side and 3 labels to right side. The labels which are left side are static and the right one are the label who gonna changed programmatically. So to access them withing our code we need to make their outlets in our <code>userWalletVc.swift</code> file like this :-
<pre><code>
import UIKit
class userWalletVC: UIViewController {
    @IBOutlet var sbdBalanceLabel: UILabel!
    @IBOutlet var savingsBalanceLabel: UILabel!
    @IBOutlet var steemBalanceLabel: UILabel!
    override func viewDidLoad() {
        super.viewDidLoad()
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}
</code></pre>

- Now we need data from steemit to show it in our labels. For this we need to pass the data between view controllers. What we do is we pass data from <code>viewController.swift</code> to <code>userDetailVc.swift</code> and then <code>userDetailVc.swift</code> to <code>userWalletVC.swift</code>.  So go to <code>viewController.swift</code> and write code to fetch user wallet details like this in your 'goButtonTapped' function :-
<pre><code>
import UIKit
import SwiftyJSON
class ViewController: UIViewController {
    @IBOutlet var nameTextfield: UITextField!
    var userName: String?
    var userBalance: String?
    var finalUserData: [String:AnyObject]?
    var json: [String:AnyObject]?
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    @IBAction func goButtonClicked(_ sender: Any) {
        let url = URL(string: "https://steemit.com/@" + nameTextfield.text! + ".json")!
        URLSession.shared.dataTask(with: url, completionHandler: {
            (data, response, error) in
            if(error != nil){
                print("error")
            }else{
                do{
                    var json = try JSONSerialization.jsonObject(with: data!, options: []) as! [String: AnyObject]
                    if let userDetailData = json["user"]!["json_metadata"] as? [String: AnyObject] {
                         DispatchQueue.main.async {
                        self.finalUserData = userDetailData["profile"] as? [String: AnyObject]
                        self.json = json["user"] as? [String : AnyObject]
                        }
                    }
                    DispatchQueue.main.async {
                        self.userName = json["user"]!["name"] as? String
                        self.userBalance = json["user"]!["balance"] as? String
                        self.sendToDetailVC()
                    }
                }catch let error as NSError{
                    print(error)
                }
            }
        }).resume()
    }
    func sendToDetailVC() {
        performSegue(withIdentifier: "userdetailSegue", sender: self)
    }
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "userdetailSegue"{
            let vc = segue.destination as! UserDetailVC
            vc.userName = self.userName
            vc.userBalance = self.userBalance
            vc.finalUserData = self.finalUserData
        }
    }
}
</code></pre>

- Now we data in <code>json dictionary</code> and we have to pass <code>json dictionary</code> to <code>userDetailVc.swift</code>. For this first we need to create a empty dictionary in our <code>userDetailVc.swift</code> like this :-
<pre><code>
import UIKit
import SDWebImage
class UserDetailVC: UIViewController {
    @IBOutlet var userNameLabel: UILabel!
    @IBOutlet var nameLabel: UILabel!
    @IBOutlet var locationLabel: UILabel!
    @IBOutlet var websiteLabel: UILabel!
    @IBOutlet var aboutMeLabel: UILabel!
    @IBOutlet var userBalanceLabel: UILabel!
    @IBOutlet var userImage: UIImageView!
    var userName: String?
    var userBalance: String?
    var finalUserData: [String:AnyObject]?
    var json: [String: AnyObject]?
    override func viewDidLoad() {
        super.viewDidLoad()
        self.userNameLabel.text = self.userName
        self.userBalanceLabel.text = self.userBalance
        self.nameLabel.text = self.finalUserData!["name"] as? String
        self.locationLabel.text = self.finalUserData!["location"] as? String
        self.websiteLabel.text = self.finalUserData!["website"] as? String
        self.aboutMeLabel.text = self.finalUserData!["about"] as? String
        let userImageUrl = self.finalUserData!["profile_image"] as? String
        self.userImage.sd_setImage(with: URL(string: userImageUrl!), completed: nil)
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}
</code></pre>

- Now write the following code in <code>viewController.swift</code> prepare segue method to pass the data in <code>userDetailsVC.swift</code> dictionary which we created above :-
<pre><code>
 override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "userdetailSegue"{
            let vc = segue.destination as! UserDetailVC
            vc.userName = self.userName
            vc.userBalance = self.userBalance
            vc.finalUserData = self.finalUserData
            vc.json = self.json
        }
    }
</code></pre>

- Now first add a button on storyboard and make it's segue to user wallet view controller like this :-
![Screen Shot 2018-03-08 at 9.15.58 AM.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1520480775/trh8adj5a9kdxl5u0fkh.png)

- Now create action outlet of button in file and call the segue on button click like this :-
<pre><code>
import UIKit
import SDWebImage
class UserDetailVC: UIViewController {
    @IBOutlet var userNameLabel: UILabel!
    @IBOutlet var nameLabel: UILabel!
    @IBOutlet var locationLabel: UILabel!
    @IBOutlet var websiteLabel: UILabel!
    @IBOutlet var aboutMeLabel: UILabel!
    @IBOutlet var userBalanceLabel: UILabel!
    @IBOutlet var userImage: UIImageView!
    var userName: String?
    var userBalance: String?
    var finalUserData: [String:AnyObject]?
    var json: [String: AnyObject]?
    override func viewDidLoad() {
        super.viewDidLoad()
        self.userNameLabel.text = self.userName
        self.userBalanceLabel.text = self.userBalance
        self.nameLabel.text = self.finalUserData!["name"] as? String
        self.locationLabel.text = self.finalUserData!["location"] as? String
        self.websiteLabel.text = self.finalUserData!["website"] as? String
        self.aboutMeLabel.text = self.finalUserData!["about"] as? String
        let userImageUrl = self.finalUserData!["profile_image"] as? String
        self.userImage.sd_setImage(with: URL(string: userImageUrl!), completed: nil)
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }    
    @IBAction func userWalletButtonTapped(_ sender: Any) {
        performSegue(withIdentifier: "userWalletSegue", sender: self)
    }
 }
</code></pre>

- Now repeat the passing data process like we do above to pass the data from there to <code>userWalletVC</code>. First create a dictionary in <code>userWalletVC</code> and then write the following code in <code>userDetailVC</code> prepare segue method :-
<pre><code>
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "userWalletSegue"{
            let vc = segue.destination as! userWalletVC
            vc.json = self.json!
        }
    }
</code></pre>

- Now we have all data on our <code>userWalletVc</code>, all we need to do is extract the data from json and apply it to our labels. To do this write code like this in <code>userWalletVc.swift</code> :-
<pre><code>
import UIKit
class userWalletVC: UIViewController {
    @IBOutlet var sbdBalanceLabel: UILabel!
    @IBOutlet var savingsBalanceLabel: UILabel!
    @IBOutlet var steemBalanceLabel: UILabel!
    var json: [String:AnyObject]?
    override func viewDidLoad() {
        super.viewDidLoad()
        self.sbdBalanceLabel.text = self.json!["sbd_balance"] as? String
        self.savingsBalanceLabel.text = self.json!["savings_balance"] as? String
        self.steemBalanceLabel.text = self.json!["balance"] as? String
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}
</code></pre>

- Now run the app and check what you see in your wallet screen. Now we have a page which shows details of user wallet. In next part of tutorial we add validation and all other necessary check on user textfield. If you new to this tutorial, check course curriculum section for previous tutorials of this series. Till then enjoy coding in swift.

#### Curriculum
Place here a list of related tutorials you have already shared on Utopian that make up a Course Curriculum, if applicable.


- [How to integrate steem-api in swift project Part #1](https://utopian.io/utopian-io/@iamankit/how-to-integrate-steem-api-in-swift-project-part-1)
- [How to integrate steem-api in swift project Part #2 Creating User Profile Page](https://utopian.io/utopian-io/@iamankit/how-to-integrate-steem-api-in-swift-project-part-2-creating-user-profile-page)
- [Integrate steem-api in swift project Part #3 Design User Profile and add details of user on page](https://utopian.io/utopian-io/@iamankit/integrate-steem-api-in-swift-project-part-3-design-user-profile-and-add-details-of-user-on-page)

    

<br /><hr/><em>Posted on <a href="https://utopian.io/utopian-io/@iamankit/integrate-steem-api-in-swift-project-part-4-add-user-wallet-details-in-app">Utopian.io -  Rewarding Open Source Contributors</a></em><hr/>