29712

binding in SwiftUI Live Preview (mutable)

<h3>Question</h3>

I have a ChildView with a variable:

@Binding var itemName: String

In this ChildView I have few buttons that change value of the variable:

Button(action: { self.itemName = "different value" })

I was trying to use Preview like this:

struct ChildView_Previews: PreviewProvider { static var previews: some View { ChildView(itemName: "test") } }

But I am getting an error:

<blockquote>

Cannot convert value of type 'String' to expected argument type 'Binding'

</blockquote>

I am aware that I can use Preview like below. And the error will be gone and preview will work, but... itemName will have constant value, it will not be mutable now, not interactive in Live Preview:

struct ChildView_Previews: PreviewProvider { static var previews: some View { ChildView(itemName: .constant("test")) } }

How to declare a binding in SwiftUI Preview to make it interactive?


<h3>Answer1:</h3>

Update: @State appears does not update previews directly, so idea is to wrap testing view into thing @State provider, which refreshes previewed view. Tested as worked on Xcode 11.2.1.

struct ChildView: View { @Binding var itemName: String var body: some View { VStack { Text("Name: \(itemName)") Button(action: { self.itemName = "different value" }) { Text("Change") } } } } struct ChildView_Previews: PreviewProvider { struct BindingTestHolder: View { @State var testItem: String = "Initial" var body: some View { ChildView(itemName: $testItem) } } static var previews: some View { BindingTestHolder() } }
<h3>Answer2:</h3>

If you need a value that can be changed in the live preview, I like to use this helper class:

<pre class="lang-swift prettyprint-override">struct BindingProvider<StateT, Content: View>: View { @State private var state: StateT private var content: (_ binding: Binding<StateT>) -> Content init(_ initialState: StateT, @ViewBuilder content: @escaping (_ binding: Binding<StateT>) -> Content) { self.content = content self._state = State(initialValue: initialState) } var body: some View { self.content($state) } }

Use it like so:

<pre class="lang-swift prettyprint-override">struct YourView_Previews: PreviewProvider { static var previews: some View { BindingProvider(false) { binding in YourView(yourBindingVar: binding) } } }

This allows you to test changing the binding in the live preview.

来源:https://stackoverflow.com/questions/59246859/binding-in-swiftui-live-preview-mutable

Recommend

  • Metadata lost when saving photo using PHPhotoLibrary
  • Distributed Elixir example doesn't work
  • FileUpload + UpdatePanel does not work on first click
  • get widgets by name from layout
  • PDF download is not working from serverside in golang
  • post multi-select list to list of objects asp.net core 2
  • How to clone bootstrap multi-select dynamically?
  • Updating DataGridView Selected Rows
  • how to partition the nodes of an undirected graph into k sets
  • Add a column to fits file with Astropy
  • How to extract details from the xml files using java?
  • Swift 3 and JSON – Updating the database by running a URL in the background
  • parser m3u file using java in android studio
  • How to use a Git repository with multiple projects?
  • Proc sql: new and continue customers based on look back period
  • How to use grep to output unique lines of code from a file?
  • Encode string to Base64 in Inno Setup (Unicode Version of Inno Setup)
  • In Moment.js, how do you get the date of the next occurrence of a specific month (ex: 'next Jan
  • Redmine can't generate secret token
  • I have a problem with the Fetch API using Internet Explorer 11
  • Laravel Query Builder Update with Increment
  • Working with codeception and laravel
  • why 'read' command in shell script is missing initial characters? [duplicate]
  • SqlDatasource select parameters
  • Sorting Custom Listview Items Using Spinner Android
  • Refresh JSF component after custom javascript Ajax call
  • On unchecking a checkbox trigger an event
  • internal javascript not works in angular2
  • First dynamically-added TinyMCE editor displays, others do not
  • How to add html image in to velocity template file to send email?
  • Debugging php script timeout?
  • Creating 2d platforms using JavaScript
  • How to define something in JavaScript [closed]
  • How to write seo friendly url's using htaccess?
  • Is there a better way for handling SpatialPolygons that cross the antimeridian (date line)?
  • Neo4j…how to get a visual representation of my data?
  • How to warp text around image in iOS?
  • Bitrate JWplayer
  • Accessing Arguments, Workflow Variables from custom activities
  • How to check if object is null in Java?