Comment faire en sorte que le texte de SwiftUI soit coupé au lieu d'être tronqué par des points (...) ?

Question

Dans une vue SwiftUI, j'ai plusieurs Text éléments dans un HStack . En fonction de la saisie de l'utilisateur, il n'y aura pas d'espace horizontal pour afficher tous les textes. Le site HStack fait bien son travail en s'assurant que tous les Text les éléments ont une largeur égale et les chaînes sont tronquées. Tout cela est conforme à ce qui est attendu et à ce qui devrait être.

Le problème est que toutes les chaînes de caractères sont tronquées avec un "..." à la fin alors que je veux le comportement de UILabel.lineBreakMode = .byClipping c'est-à-dire que la ficelle doit simplement être coupée au bord de l'écran. Text élément.

Comment puis-je y parvenir ?

Editer pour plus de détails sur ce que je veux :

import SwiftUI

struct TextClipPoC: View {
    var body: some View {
        HStack {
            textElm
            textElm
            textElm
            textElm
        }
    }

    var textElm: some View {
        Text("abcdefghijklmn")
            .padding(.all, 3)
            .background(Color.yellow)
    }
}

struct TextClipPoC_Previews: PreviewProvider {
    static var previews: some View {
        TextClipPoC()
            .previewLayout(.fixed(width: 320, height: 40))
    }
}

donne cette sortie :

Je veux exactement la même sortie que ci-dessus, sauf qu'au lieu de "...", je veux que le texte soit simplement coupé.

Si j'ajoute juste .fixedSize() à la HStack (ou à la Text ), comme suggéré dans une solution, j'obtiens ce résultat :

Answer 1

Une solution consiste à superposer deux instances de la même Text Il s'agit d'une taille fixe et d'une taille normale, de laisser la taille normale décider de la taille et de la cacher, puis d'avoir la taille fixe coupée.

Peut être fait avec un ViewModfier :

struct FixedClipped: ViewModifier {
    func body(content: Content) -> some View {
        ZStack(alignment: .leading) {
            content.hidden().layoutPriority(1)
            content.fixedSize(horizontal: true, vertical: false)
        }
        .clipped()
    }
}

extension View {
    func fixedClipped() -> some View {
        self.modifier(FixedClipped())
    }
}

et ensuite utilisé comme ceci :

struct TextClipPoC: View {
    var body: some View {
        HStack {
            textElm
            textElm
            textElm
        }
    }

    var textElm: some View {
        Text("abcdefghijklmn")
            .padding([.leading, .trailing], 3)
            .background(Color.yellow)
            .fixedClipped()
    }
}

struct TextClipPoC_Previews: PreviewProvider {
    static var previews: some View {
        TextClipPoC()
            .previewLayout(.fixed(width: 320, height: 40))
    }
}

Cela donne ce résultat :

Answer 2

Pour éviter la troncature, il faut utiliser une taille fixe, comme par exemple

HStack {

   ... your text items here     

}
.fixedSize()

tout le reste dépend du contexte d'utilisation et nécessitera .clipped à un certain conteneur supérieur.

Une autre solution possible est d'utiliser des ScrollView comme

ScrollView(.horizontal) {
    HStack {

       ... your text items here     

    }
}.disabled(true)