見出し画像

いざ! SwiftUI -6 非表示の方法

表示部分のコードです。

import SwiftUI

struct IfElseTrain: View {
    
    var longerTrain: Bool
    
    var body: some View { 
        VStack { 
            HStack {
                Image(systemName: "train.side.rear.car")

                if longerTrain {  
                    Image(systemName: "train.side.middle.car")  
                }
                            
                Image(systemName: "train.side.front.car")
            }    
             .font(.largeTitle)
            Divider()      
        } 
    }
}

Image()を3つ並べて3つ連結した電車のイメージで、真ん中の車両が

if longerTrain {
  Image(systemName: "train.side.middle.car")
}

となっていて、変数longerTrainの真偽でImage()を有効、無効にしています。真、trueの場合は表示、falseの場合は表示されません。

"if"とは違う方法で真偽で消します。

Image(systemName: "train.side.middle.car")
   .opacity(longerTrain ? 1 : 0)

モディファイアで真偽で透明度を変えて見えなくします。三項演算子を使います。

longerTrain ? 1 : 0

透過度を変数longerTrainが真であれば透過度を"1"(見える)、偽であれば透過度"0"(見えない)にします。

"if"ではではそのものの表示、非表示なので前後の車両が詰まって表示されます。

それに対して透過度を変える方法ではものは存在するので真ん中が空いた状況になり、前後の車両の真ん中が空いた表示になります。


Playgroundで表示させる場合はContentView:Viewで実際の表示部分の構造体を設定します。

引数に変数longerTrainがtrue、false、を入れて

import SwiftUI

struct ContentView:View{    
    var body: some View {        
        IfElseTrain(longerTrain: true)
        IfElseTrain(longerTrain: false)    
    }
}

として実行すると"if"もしくは"opacity"で表示、非表示となったものが比較できます。



この記事が気に入ったらサポートをしてみませんか?