0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

思いつきによる初心者のiOS開発 part.1

Posted at

思いつきでSwiftでiOSのアプリを開発することにしました。
触ったこともないので単純な画面と単純な機能を作成してみます。

1.画面イメージの作成
今回は、単純な画面イメージを作成します。
なぞなぞを出題し、回答するアプリケーションとしており、上部に問題文を表示し、下部に回答を入力するテキストボックスとボタンを作成する予定です。
テキストが解答とあっていると、正解と表示されます。下部のボタンをタップすると、正解の表示が消え、問題文が表示される状態になります。
以下は画面のイメージです。

スクリーンショット 2022-07-26 13.31.46.png

2.XCodeで実装
単純なものですが、作成するのに5時間ほどかかりました。
画面イメージとは少し違う感じですが、まあよいとしましょう。
なにか作ることが目的だったので本人としては満足です。
以下はソースコードと作成した画面になります。

ContentView.swift
import SwiftUI

struct ContentView: View {
    @State private var answer = ""
    @State var buttonText = "Button"
    @State var flag = false
    
    // 画面サイズ
    @State var screenSizeHeight = UIScreen.main.bounds.height
    @State var scSizeWidth = UIScreen.main.bounds.width
    
    var body: some View {
        VStack {
            Spacer().frame(height:screenSizeHeight/16)
            if (self.flag){
                Text("正解!!")
                    .frame(width: scSizeWidth, height: screenSizeHeight/8, alignment: .center)
                    .font(.largeTitle)
                    .background(.red)
                    .foregroundColor(.white)
            }else{
                Text("")
                    .frame(width: scSizeWidth, height: screenSizeHeight/8, alignment: .center)
            }
            Spacer().frame(height:screenSizeHeight/128)
            Text("みないでのむのみものは?")
                .font(.title)
                .foregroundColor(Color(red: 122/255, green: 122/255, blue: 122/255, opacity: 1.0))
            Spacer().frame(height:screenSizeHeight/8)
            TextField("Answer", text: $answer)
                .textFieldStyle(RoundedBorderTextFieldStyle())
                .padding()
                .offset(x: 0, y: screenSizeHeight/8)
                .frame(width: scSizeWidth*0.8, height: screenSizeHeight/8, alignment: .center)
                .background(.white)
            Spacer().frame(height:screenSizeHeight/8)
            Button(action: {
                if (self.flag ){
                    buttonText = "Return"
                    flag = false
                }else if(answer == "みず"){
                    buttonText = "Button Tapped"
                    flag = true
                }
            }){
                Text(buttonText)
                   .font(.largeTitle)
                   .foregroundColor(Color(red: 122/255, green: 122/255, blue: 122/255, opacity: 1.0))
                   .padding()
            }
            Spacer().frame(height:screenSizeHeight/16)
        }
        .frame(maxWidth: .infinity,
               maxHeight: .infinity)
        .background(.white)
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
            ContentView()
    }
}

IMG_3191.PNG
IMG_3192.PNG

3.今後の予定
気まぐれでiOS開発をしようなかと思っています。
答えが間違っている時に動作がなにもないので、変更しようかな。
part.1としましたが、今回が最終回の予定も気がしなくはないです。。。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?