如何在swift中改变按钮内的矩形的颜色?

nbnkbykc  于 2023-06-04  发布在  Swift
关注(0)|答案(3)|浏览(573)

在swift中更改按钮的标签
你好,我想让一个按钮的矩形改变其颜色时点击.该怎么办呢?
这是我的代码(im noob)

Button(){

}label: {
    Rectangle().fill(.black).frame(width:30, height:30)
}

编辑:对不起,我忘了说,它应该有不止一种颜色。

nwlls2ji

nwlls2ji1#

下面的例子如何(单击在两种颜色之间切换):

struct ContentView: View {
  @State private var clicked = false
  let color1 = Color.yellow
  let color2 = Color.purple
  
  var body: some View {
    Button() {
      clicked.toggle()
    } label: {
      Rectangle().fill(clicked ? color1 : color2)
    }
    .frame(width: 60, height: 30)
  }
}
qvtsj1bj

qvtsj1bj2#

你有一套颜色,你必须使用或你想使用一个随机的颜色对每一次点击?
这里有两个选项,只是取消注解你想使用的任何一个:
一个使用设置颜色的数组,另一个使用Color扩展每次获得一个随机颜色:

struct ContentView: View {
    @State private var color: Color = .black
    private var colors: [Color] = [.black, .red, .green, .yellow, .cyan]
    
    var body: some View {
        Button() {
            // pick one of the below options and comment out the other.
            
            // this gets a random color each time
            color = Color.random()
            // this gets a random color from the pre set colors array above.
            // you could also keep track of index and loop over the colors in order and start over if needed.
//            if let randomColor = colors.randomElement() {
//                color = randomColor
//            }
        } label: {
            Rectangle().fill(color)
        }
        .frame(width: 60, height: 30)
    }
}

public extension Color {
    static func random() -> Color {
        Color(
            red: .random(in: 0...1),
            green: .random(in: 0...1),
            blue: .random(in: 0...1),
            opacity: 1
        )
    }
}
up9lanfz

up9lanfz3#

你可以使用ButtonStyleisPressed来实现。

Button(){

      } label: {
        Text("Tap")
          .foregroundColor(.white)
      }
      .buttonStyle(ExampleButtonStyle())
struct ExampleButtonStyle: ButtonStyle {

  func makeBody(configuration: Configuration) -> some View {
    configuration.label
      .background {
        Rectangle().fill(configuration.isPressed ? .yellow : .black)
      }
  }
}

相关问题