iOS 14 Features — Revision Part 2

Hey guys, Apple officially release iOS 15 on sept 14. Before that we will revise what is new in iOS 14. Here is the part 2. I covered some highlight concepts only. But there are more in iOS 14.

Here are some table of contents for the part 2

1. LazyVGrid
2. LazyVStack
3. scroll to page
4. Map view — No more additional properties.

LazyVGrid — CollectionView using lazyvgrid

Here i used LazyVGrid to create a collection view look and loaded data for look. Here is the piece of code to design collection.

struct ContentViewCollect: View {
  let items: [TableData] = initData.shared.DataREturn()
  let columns = [
  GridItem(.adaptive(minimum: UIScreen.main.bounds.width/4))
  ]
  var body: some View {
    ScrollView {
      LazyVGrid(columns: columns, spacing: 20) {
      ForEach(items, content: {(row) in
      CollectionCell(item: row) //in previous post you can get this
       })
     }
    .padding(.horizontal)
    }
   .frame(maxHeight: UIScreen.main.bounds.height - 120)
  }
}

LazyVStack

We can use lazystack as tableview list by adding scrollview to it. Here is. the piece of code just implemented the list

struct ContentView: View {
  var body: some View {
   NavigationView{
    ScrollView {
     LazyVStack {
      ForEach(1...100, id: \.self) { value in
       Text("Hello LAzyStAck")
      }
    }
   }
   .frame(height: UIScreen.main.bounds.height-180)
  .navigationBarTitle("Lazy Stack")
  }
 }
}

Scroll to Specific cell

Here ScrollViewReader helps us to scroll to specific page of scroll view. Here is piece of code

struct ContentView: View {
@State var textval = "1"
var body: some View {
ScrollView {
ScrollViewReader { value in
TextEditor(text: $textval)
.keyboardType(.numberPad)
.frame(width: 120)
Button("click to jump") {
value.scrollTo(Int(textval))
}
.padding()
ForEach(0..<100) { i in
Text("Example \(i)")
.font(.title)
.frame(width: 200, height: 200)
.background(Color.gray)
.id(i)
}
}
}
.frame(height: 300)
}
}

Map view

iOS 14 introduced map view but unfortunately there is no more properties to change map view. We can use that by initialising Mapcoordinate region.

@State private var region = MKCoordinateRegion(center: CLLocationCoordinate2D(latitude: 12.6620, longitude: 79.5435), span: MKCoordinateSpan(latitudeDelta: 0.5, longitudeDelta: 0.5))

Now in body init map view with the above lat and long.

Map(coordinateRegion: $region)
     .frame(width: 400, height: 300)

Follow me for more updates.

Happy Coding!💜