Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

SwiftUI how do I give a Slider a minimum and maximum value and display its value in a Text?

Tags:

ios

swift

swiftui

import SwiftUI

struct ContentView : View {
    var body: some View {
        PasswordGeneratorSettings(settingsConfiguration: PasswordGeneratorSettings.Settings.init(passwordLength: 20))
    }
}


struct PasswordGeneratorSettings : View {
    @State var settingsConfiguration: Settings
    struct Settings {
        var passwordLength = UInt()
    }
    var body: some View {
        NavigationView {
            List {
                Slider(value: $settingsConfiguration.passwordLength) { pressed in
                    Text("Password Length: \(settingsConfiguration.passwordLength)")
                }
                }.navigationBarTitle(Text("Settings"))
        }
    }
}

So I'm making a password generator and I want to start off with a slider with a minimum length of 1 and a maximum length of 512 with a label displaying it's value (As an integer) but this is all I got to just try having an updating label on the left of the tableview (List) with the slider on the right but this doesn't even compile.

Too Long Didn't Read: I'm trying to:

  1. Figure out how to set a minimum and maximum value with a Slider

  2. Have a label with the Slider's value (as an integer) on the left side of a tableview cell with the slider on the right side.

And I want to do all of this without UIKit just SwiftUI (and Combine if needed).

like image 533
SmushyTaco Avatar asked Jun 25 '19 04:06

SmushyTaco


People also ask

Can you set the current value of the slider beyond the range min max?

If you try to programmatically set a slider's current value to be below the minimum or above the maximum, it's set to the minimum or maximum instead. However, if you set the value beyond the range of the minimum or maximum in Interface Builder, the minimum or minimum values are updated instead.

How do I use slider in swift 5?

Enter Swift as Language and choose Next. Go to the Storyboard and drag a Slider to the main view and span its width to the width of the main View. Select the slider and go to the Attributes inspector. Under the slider section change the maximum value to 100 and change the current value to 0.


2 Answers

This is how you use a slider:

import SwiftUI

struct ContentView : View {
    @State var length: Float = 20

    var body: some View {
        NavigationView {
            List {
                PasswordGeneratorSettings(length: $length)
            }.navigationBarTitle(Text("Settings"))
        }
    }
}


struct PasswordGeneratorSettings : View {
    @Binding var length: Float

    var body: some View {

        VStack(alignment: .leading) {
            Slider(value: $length, in: 1...512, step: 1)

            Text("Password Length: \(Int(length))")

        }
    }
}
like image 155
kontiki Avatar answered Oct 30 '22 10:10

kontiki


Your code doesn't compile because you need to use double in the slider value parameter. You can achieve your requirement using the below code. Slider takes three parameter value, from and through. In simple language, from is minValue, through is maxValue and at any given time "value" will return current value in the slider.

struct PasswordGeneratorSettings : View {
    @State var settingsConfiguration: Settings
    struct Settings {
        var passwordLength: Double = 1.0
    }
    var body: some View {
        NavigationView {
            List {
                HStack {
                    Text("Password Length: \(Int(settingsConfiguration.passwordLength))")
                    Slider(value: $settingsConfiguration.passwordLength, from: 1, through: 512)
                }
                .padding()
            }.navigationBarTitle(Text("Settings"))
        }
    }
}
like image 29
Md Shafiul Islam Avatar answered Oct 30 '22 11:10

Md Shafiul Islam