Question 66562 in IOS Swift Question posted in
The official documentation can be found here.

How to build and call a function inside onAppear modifier when we want to implement inside it a for with stride in order to show SFSymbols in SwiftUI – Ios swift

I have implemented in SwiftUI the following code:

import SwiftUI

struct onAppearmodifier: View {
    
    @State var mytext: String = "Start"

    
    let symbols: [String] = ["globe", "heart.fill","house.fill"]
    var body: some View {
     
        NavigationView {
            ScrollView {
                ForEach(0..<200) { _ in
                     Rectangle()
                        .frame(width: 200, height: 200, alignment: .center)
                        .padding()
                        .onAppear {
                            
                            //call the function that I want to build
                            
                        }
                }
            }
            .onAppear {
                
                mytext = "Fine"
            }
            
        }
        
        
    }

And I want to build a function using stride to show on canvas every each rectangle an SFSymbolthat I have declared above with period three, and I want to call this function inside onAppear() modifier for a specific number of rectangles. My idea is to implement a function of a certain type and to use the following block if I am right

 
           for index in stride(from: 0, to: symbols.count, by: 3) {
               let symbolGroup = Group {
                   Image(systemName: symbols[index])
                   Image(systemName: symbols[index + 1])
                   Image(systemName: symbols[index + 2])

But I don’t know how to code it after various tentatives. I am stuck. Any help or other suggestion will be appreciated.

Tags:

2

Answers


  1. 0

    I’m not sure why you’d think onAppear is useful here. If you want an image, use an Image.

    The "period" can be implemented by taking the remainder of the current index (don’t throw it away with _!) of the ForEach divided by 3 (or however many images you have).

    NavigationView {
    ScrollView {
        ForEach(0..<200) { i in
            Image(systemName: symbols[i % 3])
                .font(.system(size: 160)) // set the size of the symbol
                .padding()
        }
    }
}

    I’m not sure why you’d use a Rectangle either. Perhaps you want to use the image as an overlay of rectangles?

    ForEach(0..<200) { i in
    Rectangle()
        .foregroundColor(.yellow)
        .frame(width: 200, height: 200, alignment: .center)
        .overlay {
            Image(systemName: symbols[i % 3])
                .font(.system(size: 160))
        }
        .padding()
}
    Login or Signup to reply.
  2. 0

    It sounds like you want to have rows in your scroll view, each row with 3 symbols on. You should build a separate child view that takes an array of the symbols to display on each row. You then also need a function that produces these arrays.

    You need to separate drawing the view and preparing the data. It is quite hard to determine what you are trying to achieve but in this code below the sets of three symbols are set up in a display array and this is run onAppear. There is then a view that takes the array and displays the symbols on each loop of the forEach.

    The array handling in this example is pretty crude and needs to be done carefully to avoid indexes out of range. Hopefully it provides you with the way to structure this though.

        struct ContentView: View {
    @State var mytext: String = "Start"
    @State var symbolGroups: [[String]] = []
    let symbolArray: [String] = [ "globe", "heart.fill","house.fill" ,  "pencil" , "pencil.circle.fill" , "pencil.circle" ]
    
    var body: some View {
        NavigationView {
            ScrollView {
                ForEach(symbolGroups.indices , id: .self) { index in
                    RowView(symbols: symbolGroups[index])
                }
            }
        }
        .onAppear {
            createDisplayArrays()
        }
        
    }
    
    func createDisplayArrays() {
        var returnSymbolGroups: [[String]] = []
        for index in stride(from: 0, to: symbolArray.count - 1, by: 3) {
            print("Index is (index)")
            var array: [String] = []
            for subIndex in index..<(index + 3) {
                array.append( symbolArray[subIndex] )
            }
            returnSymbolGroups.append(array)
        }
        self.symbolGroups = returnSymbolGroups
    }
    
}


struct RowView: View {
    var symbols: [String]
    
    var body: some View {
        HStack {
            ForEach(symbols , id: .self) { symbol in
                Rectangle()
                    .frame(width: 100, height: 100, alignment: .center)
                    .padding()
                    .overlay {
                        Image(systemName: symbol).foregroundColor(.white)
                    }
            }
        }
    }

}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search