Learn Courses My Dashboard

What's the difference between TextField(..., axis: .vertical) and TextEditor

Now that TextField has a new parameter (axis: .vertical), which makes it a multi-line text field, how is it different from TextEditor, which is a multi-line text field?

TextEditor is used to display text. TextField can display other kinds of data and be formatted according to the type of data. TextField also has the ability to have a prompt attached to it and other things that make it suitable for entering text in forms and similar situations, whereas TextEditor is really just for entering text. They serve two completely different functions.

Thanks for the reply.

It looks like TextField has all the capabilities of TextEditor and more. Is there any reason to use TextEditor rather than TextField?

I have two fields in my app’s AddView. One (Name) is a multi-line TextField. The other (Notes) is a TextEditor. What would I lose or gain by changing the Notes field to a TextField using axis: .vertical ?

Form
    {
      TextField("Name", text: $name, axis: .vertical)
        .modifier(TextFieldClearButton(text: $name))
        .keyboardType(.default)
        .disableAutocorrection(true)
        .autocapitalization(.words)
        .focused($showKeyboard)

      if duplicateItem
      {
        VStack
        {
          Text("This name already exists.")
          Text("Tap 'Save' to save it anyway.")
        }
        .foregroundColor(Color(.systemGreen))
        .font(.callout)
      }

      DatePicker("Due Date:",
                 selection: $dueDate,
                 in: Date.now...,
                 displayedComponents: .date)

      HStack()
      {
        Spacer()

        Button("Today")
        { dueDate = Date.now }
          .buttonStyle(DefaultButtonStyle())

        Spacer()

        Button("+ 1 month")
        { dueDate = Calendar.current.date(byAdding: .month, value: 1, to: dueDate )! }
        .buttonStyle(DefaultButtonStyle())

        Spacer()

        Button("+ 1 year")
        { dueDate = Calendar.current.date(byAdding: .year, value: 1, to: dueDate )! }
        .buttonStyle(DefaultButtonStyle())

        Spacer()
      }

      HStack
      {
        Text("Price: $")
        TextField("", text: $price)
          .keyboardType(.decimalPad)
          .modifier(TextFieldClearButton(text: $price))
          .focused($showKeyboard)
          .disableAutocorrection(true)
      }
      
      if !priceIsValid
      {
        Text("If you include a price, it must be a valid nonnegative number.")
          .foregroundColor(Color(.systemRed))
          .font(.callout)
      }

      Button("Options")
      { showingItemOptions = true }
      .sheet(isPresented: $showingItemOptions)
      { ItemOptionsView(itemOptions: $itemOptions, buttonLabel: buttonLabel) }
      .buttonStyle(DefaultButtonStyle())

      Section(header: Text("Notes").foregroundColor(colorContrast))
      {
        TextEditor(text: $notes)
          .focused($showKeyboard)
      }
    }
    .navigationBarBackButtonHidden(true)
    .navigationBarTitle("Add new item", displayMode: .inline)