Date Picker Button / Swiftui

Question

I've created a date picker but don't know how to place the buttons under it. Can you do that? swiftui i am learning new. I have attached the sample Design image. I want the same as in the picture.

@State private var zaman = Date()
@State private var tarihGorun = false
@State private var tarih = "Tarih Seçiniz"

---

   DatePicker("",selection: $zaman,displayedComponents: .date).labelsHidden()
            
            .accentColor(.white)
             .frame(width: 300, height: 50, alignment: .center)
            .font(Font.system(size: 25, design: .default))
             .padding(5)
             .font(Font.system(size: 15, weight: .medium, design: .serif))
             .overlay(
                 RoundedRectangle(cornerRadius: 30)
                     .stroke(Color(red: 45 / 255, green: 0 / 255, blue: 112 / 255), lineWidth: 1))
            .onTapGesture {
                self.tarihGorun = true
            }
        
        if tarihGorun {
            
            
            
            HStack{
                Button(action:{
                    
                    let zamanFormatter = DateFormatter()
                    zamanFormatter.dateFormat = "MM/dd/yyyy"
                    let alinanTarih = zamanFormatter.string(from: self.zaman)
                    self.tarih = alinanTarih
                    self.tarihGorun = false
                }){
                    Text("Tarih Seç")
                }
                
                Button(action:{
                     self.tarihGorun = false
                }){
                    Text("Kapat").foregroundColor(Color.red)
                }
            }
            
        }

Answer 1

This is the 3rd+ time you've posted the same question this week. Please do not repost questions. Here is a sample of the image, it is just a regular DatePicker() with buttons below it.

import SwiftUI


struct FirstView: View {
    
    @State var showDatePicker: Bool = false
    @State var savedDate: Date? = nil
    
    var body: some View {
        ZStack {
            HStack {
                Text("Selected date: ")
                Button(action: {
                    showDatePicker.toggle()
                }, label: {
                    Text(savedDate?.description ?? "SELECT DATE")
                })
            }
            

            if showDatePicker {
                DatePickerWithButtons(showDatePicker: $showDatePicker, savedDate: $savedDate, selectedDate: savedDate ?? Date())
                    .animation(.linear)
                    .transition(.opacity)
            }
        }
        
    }
}

struct DatePickerWithButtons: View {
    
    @Binding var showDatePicker: Bool
    @Binding var savedDate: Date?
    @State var selectedDate: Date = Date()
    
    var body: some View {
        ZStack {
            
            Color.black.opacity(0.3)
                .edgesIgnoringSafeArea(.all)
            
            
            VStack {
                DatePicker("Test", selection: $selectedDate, displayedComponents: [.date])
                    .datePickerStyle(GraphicalDatePickerStyle())
                
                Divider()
                HStack {
                    
                    Button(action: {
                        showDatePicker = false
                    }, label: {
                        Text("Cancel")
                    })
                    
                    Spacer()
                    
                    Button(action: {
                        savedDate = selectedDate
                        showDatePicker = false
                    }, label: {
                        Text("Save".uppercased())
                            .bold()
                    })
                    
                }
                .padding(.horizontal)

            }
            .padding()
            .background(
                Color.white
                    .cornerRadius(30)
            )

            
        }

    }
}



struct DatePickerWithButtons_Previews: PreviewProvider {
    static var previews: some View {
        FirstView()
    }
}