1week3 (Dice App)

4050 ワード

このアイテムはコピーされているため、appimageとappiconは保存されています.
だからmainstoryboardからユーザーインタフェースの構築を開始できます.

サイコロアプリケーションの作成


1.アプリケーション画像の作成


背景の設定



aspect fit-画像をサイズ別に塗りつぶします.
scale to fill-画面に基づいて画像が埋め込まれます.
aspect fill-画面に特定の画像が埋め込まれます.
appイメージとiconが保存されているので、シーケンスイメージボード上で構築できます.
---optionキーをクリックしてドラッグすると、画像がコピーされます.

2.コード


コードの作成はViewControllerで行います。swiftファイルで行います。


_ViewController.swift-コードファイル
Main.ストーリーボード-デザインファイル

2-1. Assistant


調整エディタオプションfile->assistantを選択します。


左側はデザインファイル、右側はコンパイラコードファイルです。



main.ストーリーボードはinterface builderとも呼ばれます

2-2. IBソケットの作成


画面には表示されませんが、コントロール+左側のマウスをクリックして12行目にドラッグして挿入できます.

--エラーコードの原因を確認するには、画面の下にあるデバッグエラー(原因:開始)を確認します.

2-3. コードの作成を試みる


>(青い部分)本質コード行



すべてのプログラミング言語で次のフォーマットが表示されます.
override func viewDidLoad() {
code goes here
}

ストーリーボードのDice 1のイメージを変えます。


コードの作成
diceImageView1.image = image.テキストを使用します.
who.what = value
誰が誰を気にしているのか,何が気にしているのか.
who = diceImageView, what = image value = image.literal

実習


最初のサイコロはデザイン上1で表示されますが、実際にアプリケーションが起動するとサイコロは6になります.

IBoutletコードで画像を設定できます

アプリケーションを起動したら、Rollボタンを押して、ダイヤルの画像を変更するコードを書きます。


まず、他のタイプのリンクを作成します.

28行目でrollボタンをクリックしてドラッグしてインポートします.
このコードはIBoutletではなく,インタフェースビルダー動作IBACTIONである.
マウスボタンを押して、ダイヤル1、2の画像を変更するコードを書きます.


1.IBOUttletsの右側から左に移動します.
2.ユーザーインタフェースの一部をコードで変更します.
3.IBACTIONは左から右に移動しますが、ユーザーインタフェースとのインタラクションでコードに何かが起こります.

スクロールボタンを押すたびに画像が変わります


-配列の使用
-配列項目の順序のみをソート
-ゼロから
var leftDiceNumber = 1      //변수와 값을 생성
var rightDiceNumber = 5     
diceImageview1.image = [][leftDiceNumber]//다이스 이미지 1을 6개의 주사위 이미지로 변경, leftdiceNumber = 1
leftDiceNumber = leftdicenumber + 1 // 하나 실행할때마다 1씩 더해준다.

サイコロ画像をランダム化する方法


import UIKit
class ViewController: UIViewController {
@IBOutlet weak var diceImageView1: UIImageView!
@IBOutlet weak var diceImageView2: UIImageView!


@IBAction func rollButtonPressed(_ sender: UIButton) {
    
    let diceArray = [ #imageLiteral(resourceName: "DiceOne"), #imageLiteral(resourceName: "DiceTwo"), #imageLiteral(resourceName: "DiceThree"), #imageLiteral(resourceName: "DiceFour"), #imageLiteral(resourceName: "DiceFive"), #imageLiteral(resourceName: "DiceSix") ] 
/diceArrayという名前の変数を作成してコードを簡略化
diceImageView1.image = diceArray.randomElement()/randomElement()->配列を表示し、どれだけの項目があるかを決定し、任意の要素を指定します.
diceImageView2.image=diceArray[In.random(in:0…5)]//int.random(in:0…5)]->0~5ランダム
}
}