How to prevent TextEditor from scrolling in SwiftUI?

Question

I am trying to create a list of TextEditors as part of a SwiftUI app. I want the individual editors not to scroll, as they make up a larger scrolling list. However, when I add the TextEditors to the list, they compress down and each view becomes individually scrollable. Is there a modifier / trick to getting the TextEditor to always fit its text content without scrolling, so I can achieve this?

A minimal example of what I'm trying to do is below:

struct ParentView: View {
    var items: [Item]

    var body: some View {
        List(items, id: \.id) { item in
            EditorView(item: item)
        }
    }
}

struct EditorView: View {
    @ObservedObject var item: Item

    var body: some View {
         TextEditor(text: $item.text)
    }
}

This is in a macOS SwiftUI app, not an iOS one, in case there is any platform differences.

Edit: As pointed out in the comments I tried this approach Dynamic row hight containing TextEditor inside a List in SwiftUI but it didn't seem to work correctly - the rows still didn't expand properly.

Does this answer your question https://stackoverflow.com/questions/62620613/dynamic-row-hight-containing-texteditor-inside-a-list-in-swiftui? — Asperi, Aug 03 '20 at 18:16
No - sorry I should have mentioned I tried that approach, it didn't seem to work for me. — merithayan, Aug 03 '20 at 18:48

score 5 · Accepted Answer · answered Nov 30 '20 at 18:51

5

To solve this problem, I ended up using the .fixedSize(horizontal: false, vertical: true) modifier to fix the TextEditor to its full size, which then allowed the solution in Dynamic row hight containing TextEditor inside a List in SwiftUI to work as expected within the list.

answered Nov 30 '20 at 18:51

merithayan

398
5
13

The `.fixedSize` modifier did the trick in iOS 14 without the use of a `ZStack` and an empty `Text` element. I didn't have mine in a `ScrollView`, though. Thanks! – Clifton Labrum Mar 04 '21 at 19:10
1

Unfortunately it doesn't work on ios15 – Manuel Zompetta Sep 28 '21 at 09:24

score 2 · Answer 2 · answered Dec 17 '21 at 06:05

iOS 15 can use in init UITextView.appearance().isScrollEnabled = false

init(para: EditorParagraph) {
      self._para = StateObject(wrappedValue: para)
      UITextView.appearance().backgroundColor = .clear
      UITextView.appearance().textDragInteraction?.isEnabled = false
      UITextView.appearance().isScrollEnabled  = false // here
}

var body: some View{
    ZStack {
        Text(para.content.isEmpty ? para.placeholder : para.content)
            .font(.system(size: para.fontSize, weight: para.content.isEmpty ? .thin : .regular))
            .lineSpacing(6)
            .opacity(para.content.isEmpty ? 1 : 0)
            .padding(.all, 8)
            .frame(maxWidth: .infinity, alignment: .leading)
    
        TextEditor(text: $para.content)
            .font(.system(size: para.fontSize, weight: .regular))
            .foregroundColor(.black)
            .lineSpacing(6)
    
    }
}

score 1 · Answer 3 · answered Aug 17 '22 at 15:38

1

Will be fixed in macOS 13.0 with a scrollDisabled(_disabled: Bool) function. Seems to be a major hole in TextEditor

https://developer.apple.com/documentation/swiftui/list/scrolldisabled(_:)

answered Aug 17 '22 at 15:38

Zach Hall

71
3

How to prevent TextEditor from scrolling in SwiftUI?

3 Answers3