[Swift5]テキストフィールドに入力した数値をカンマと円を付けて表示させる

久しぶりの更新です。
最近、ずっと貯金系のアプリを作ってて、またブログの更新が疎かになってしまってます。
前の記事にアプリ作ってる時こそ記事を更新するべき！みたいな事を書いた気がするんですけど、、、時間が、、、お酒飲みたいし、、、眠いし、、、で全然更新できませんでした(￣▽￣)

えぇと言う事で、記事にしたい事はいっぱいあるんですけど、リハビリもかねて簡単な内容の記事を書こうと思います。

前置きが長かったですね。それではいきましょう！

テキストフィールドに金額を入力する時にカンマ欲しいですよね？
今回はテキストフィールドに数字を入力すると、自動的にカンマと円を付けてくれるプログラムを紹介したいと思います！

完成はこんな感じです！
※今回はテキストフィールドに入力される値が数値だけを想定してます。
　数値だけしか入力できないようにする処理はしてないのでご注意を！

下準備！

とりあえずLabelとTextFieldとButtonをこんな感じで配置しましょう！

次は、下記コードのようにViewControllerと紐付けましょう！

 @IBOutlet weak var label: UILabel!
 @IBOutlet weak var textField: UITextField!
 @IBAction func Btn(_ sender: Any) {
   label.text = textField.text
}

下準備は以上です！
テキストフィールドに入力してボタンを押したらラベルに表示してくれる流れです。

数字を入力するとカンマと円を付けてくれる関数

まずは数字を入力するとカンマと円を付けてくれる関数を書きます。
とりあえずコードを見てましょう！

 func getComma(num: Int) -> String {
        let formatter = NumberFormatter()
        formatter.numberStyle = .decimal
        formatter.groupingSeparator = ","
        formatter.groupingSize = 3
        let number = "\(formatter.string(from: NSNumber(value: num)) ?? "")円"
        
        return number
    }

３桁毎にカンマ区切りにした文字列に変換するにはNumberFormatter()を使います！
NumberFormatter()の部分は2行目からです。
見たらわかると思いますが、簡単に説明します。

2行目でインスタンスを生成してます。

3行目のnumberStyleを変更する事で%を付けたり色々できるみたいです！
今回はカンマなので.decimalです。
詳しくはこちらで確認できます！

4行目で指定した文字が挿入されて5行目でカンマの場所を変更できます。

6行目で変換した文字列の末尾に円を追加してlet numberに代入してます。

この関数は引数にInt型を指定するとカンマと円を付けて返してくれる仕組みになっています。
例えば下記のように使います。

let money = getComma(num: 10000)
print(money)//結果　10,000円

テキストフィールドの値が変更された時の関数

次にテキストフィールドの値が変更されるたびに呼ばれる関数を作ります。
テキストフィールドを下記のように紐付けましょう！

赤枠の部分を変更するのを忘れないで下さいね〜
名前は任意の名前でOKです！
紐付けると下記のようにコードが生成されます。

    @IBAction func EditingChanged(_ sender: Any) {
      
    }

ではこの中に処理を書いていきます！
イメージはテキストフィールドに数字を入力するたびに、数字にカンマと円を付けてテキストフィールドのテキストに再代入してる感じです。
なので下記のコードのように書きたいところですが、このままではうまくいきません。

    @IBAction func EditingChanged(_ sender: Any) {
        if let value = textField.text {
            textField.text = getComma(num: Int(value) ?? 0)
                }
    }

getComma()の引数はInt型なので、Int型以外は0になってしまいます。
例えばテキストフィールドに3と入力すると、3円と変換してtextField.textに代入します。
その3円が再び3行目のvalueに入って来てしまうので、getComma()の引数にString型が入ってしまい0になってしまうんですね。

ではどうすれば良いかですが、valueにカンマと円があれば、削除してからgetComma()に渡して、再びカンマと円を付けてもらいます。

指定した文字列を削除してくれる関数

カンマと円を削除してくれる関数は下記コードです。

    func removeText(str:String) -> String{
        let comma = str.replacingOccurrences(of:",", with:"")
        let yen = comma.replacingOccurrences(of:"円", with:"")
        return yen
    }

簡単に説明すると、
2行目でカンマを削除して一回、定数のcommaに代入します。
3行目で円を削除して、値を戻してます。
この関数を使って下記のように書くとうまくいくはずです！

    @IBAction func EditingChanged(_ sender: Any) {
        if let value = textField.text {
            textField.text = getComma(num: Int(removeText(str: value)) ?? 0)
        }
    }

どうでしょうか？うまくいきましたか？
ただ、入力を編集しようとして数値を削除するといちいちカーソルが円の右側に来てしまうのでこれはなんらかの対応をしないといけないですね。
また、それは別のお話と言う事で(^^;
コード全部載せておきます！

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

    @IBOutlet weak var label: UILabel!
    @IBOutlet weak var textField: UITextField!
    @IBAction func Btn(_ sender: Any) {
        label.text = textField.text
    }
    @IBAction func EditingChanged(_ sender: Any) {
        if let value = textField.text {
            textField.text = getComma(num: Int(removeText(str: value)) ?? 0)
        }
    }
    //金額にカンマを入れる関数。引数に金額を入れるとカンマを足して返してくれる。
    func getComma(num: Int) -> String {
        let formatter = NumberFormatter()
        formatter.numberStyle = .decimal
        formatter.groupingSeparator = ","
        formatter.groupingSize = 3
        let number = "\(formatter.string(from: NSNumber(value: num)) ?? "")円"
        
        return number
    }
    //文字列にカンマと円があれば削除して返してくれる。
    func removeText(str:String) -> String{
        let comma = str.replacingOccurrences(of:",", with:"")
        let yen = comma.replacingOccurrences(of:"円", with:"")
        return yen
    }
}

まとめ

書き終わってから気づいたんですけど、LabeとButtonいらなかったですね！w
今作ってるアプリも8割くらいできているので来月には公開できるかと思います！
ちなみに初めて作った「超シンプル習慣記録メモ」アプリは20くらいしかインストールされておりません(　ﾟдﾟ)
自分でめっちゃ使ってるからいいんですけど、それにしても少ない、、、
無料なので試しに使ってくれると嬉しいです！