iOS 17 - TextField color does not changes with state is updated

Question

bill2022 OP

Created Oct ’23

Replies 6

Boosts 1

Views 1.3k

Participants 4

Hi! I find this code does not work as expected on iOS 17 simulator and device. It was working correctly with iOS 16:

struct ContentView: View {
    @State private var numberText = ""

    var color: Color {
        let result = (Int(numberText) ?? 0) <= 0
        if result {
            return .black
        }

        return .red
    }

    var body: some View {
        VStack {
            TextField("Enter a number", text: $numberText)
                .font(.title)
                .foregroundStyle(
                    color
                )

            Text("Font color will turn red if number > 0")
                .foregroundColor(.gray)
        }
        .padding()
    }
}

I tried a workaround and it works:

struct ContentView: View {
    @State private var numberText = ""
    @State private var color = Color.black

    func updateColor() ->Color {
        let result = (Int(numberText) ?? 0) <= 0
        if result {
            return .black
        }

        return .red
    }

    var body: some View {
        VStack {
            TextField("Enter a number", text: $numberText)
                .font(.title)
                .foregroundStyle(
                    color
                )
                .onChange(of:numberText) {
                    color = updateColor()
                }

            Text("Font color will turn red if number > 0")
                .foregroundColor(.gray)
        }
        .padding()
    }
}

Boost

Answer 1

Claude31 OP

Oct ’23

Could you check result ?

    var color: Color {
        let result = (Int(numberText) ?? 0) <= 0
        print("numberText", numberText, "Int", Int(numberText), "result =", result)  // <<== Add this and tell what you get when typing a number ?

        if result {
            return .black
        }

        return .red
    }

0

Answer 2

bill2022 OP

Oct ’23

@Claude31 the print output as I expected, the the TextField color does not update on iOS 17 simulator. Here is the output for input 0, 1, A:

numberText  Int nil result = true
numberText 0 Int Optional(0) result = true
numberText  Int nil result = true
numberText 1 Int Optional(1) result = false
numberText  Int nil result = true
numberText A Int nil result = true

0

Answer 3

bill2022 OP

Oct ’23

Change the code to confirm that the issue affects TextField, but not Text. The code below change the Text color to red when 1 is entered, but not change the TextField color.

struct ContentView: View {
    @State private var numberText = ""

    var color: Color {
        let result = (Int(numberText) ?? 0) <= 0

        if result {
            return .black
        }

        return .red
    }

    var body: some View {
        VStack {
            TextField("Enter a number", text: $numberText)
                .font(.title)
                .foregroundStyle(
                    color
                )

            Text("Font color will turn red if number > 0")
                .foregroundStyle(
                    color
                )
        }
        .padding()
    }
}

0

Answer 4

bill2022 OP

Oct ’23

tested with iOS 17.1 beta and the issue still exists

0

Answer 5

ZeTof OP

Jul ’24

Tested with iOS 17.5 still exists

1

Answer 6

bill2022 OP

Aug ’24

Tested with iOS 18.1 and Xcode 16.1 beta and the issue still exists

0