CODEWITHSUNDEEP
swiftui
user6539552
user6539552

Reputation: 1461

Automatic adjust font size in Text() of SwiftUI?

Is there any way to automatically adjust the font size according to the length of the text to be displayed? For example, by setting the frame size? Can it reduce the font size automatically so that the width for displaying the font is still the same?

var body: some View {
    
    VStack {
        ZStack {
            GeometryReader { g in
                ZStack {
                    
                    ScrollView(.vertical, showsIndicators: true, content: {
                    VStack {
                        ZStack {
                            VStack {
                                Image("cat")
                                    .resizable()
                                    .aspectRatio(contentMode: .fill)
                                    .frame(width:g.size.width, height:g.size.height/4*3)
                                    .clipped(antialiased:true)
                                    .shadow(radius:25, x:0, y:0)
                                
                                VStack (){
                                    HStack {
                                        VStack (alignment: .leading) {
                                            HStack {
                                                Text("XXXX").font(.title)
                                               
                                                        .font(.system(size:35)).foregroundColor(.black).shadow(radius: 5)
                                                })
                                                Spacer()
                                                

                                            }
                                            HStack {
                                                Text("xxxxxxxxxxxxx xxxxxxxxxxx xxxxxxxxxx ").font(.title2) // very long text here
                                                Spacer()
                                            }
                                        }
                                    }
                                    
                                }
                                .padding()
                                .frame(width:g.size.width, height:g.size.height/4*1, alignment: .top)
                            }
                        }.frame(width: g.size.width, height: g.size.height, alignment: .top)
                        

            }
            .edgesIgnoringSafeArea(.all)
        }
    }
}

As you see in my code, there is a very long text there. The text can be displayed perfectly on most devices except iPod Touch where it will be displayed as "xxxxxxxx xxxxxxxx xxxx ... ", "..." at the end because it is too long to be displayed. Is there any way that it automatically, either jumps to the next line, or shrinks the fonts so that there will not be "..." at the end?

Upvotes: 7

Views: 5598

Answers (1)

Raja Kishan
Raja Kishan

Reputation: 19044

Use minimumScaleFactor(_:)

struct ContentView: View {
    var body: some View {
        VStack{
            Text("Test string")
                .minimumScaleFactor(0.1) // <-- Here
                .frame(width: 15, height: 15)
        }
    }
}

Upvotes: 8

Related Questions