title: Blur view when button is pressed swiftui
body: <p>I have a view with a toolbar on the bottom of the view. When clicked - two buttons are displayed. I am trying to achieve when the toolbar is pressed and the buttons are now displayed, the view (or background) becomes blurred/grayed out, except for the newly produced items.</p>
  <p>I attached a screenshot of the desired effect I am aiming for.</p>
  <pre><code>struct UserDashController: View {
      
     // @State private var showMealView = false
      @State private var showSettingsView = false
      @State private var showAddViews = false
  
      @State private var angle: Double = 0
      
      init(){
          UIToolbar.appearance().barTintColor = UIColor.white
      }
      
      var body: some View {
          NavigationView {
              VStack{
                 Text(&quot;Blue me Please&quot;)
                      .frame(width: 400, height:600)
                      .background(.orange)
              }
              //sets setting bar top right
                  .toolbar {
                      ToolbarItem(placement: .navigationBarTrailing) {
                          VStack{
                              Button(action: {
                                  showSettingsView.toggle()
                              }) {
                                  Image(systemName: &quot;line.3.horizontal&quot;)
                                      .font(.title3)
                                      .foregroundColor(.black)
                              }
                              .sheet(isPresented: $showSettingsView){
                                  JournalEntryMain()
                              }
                          }
                     }
                      
                     // sets add meal option bottom/center
                      ToolbarItem(placement: .bottomBar) {
  
                          //displaying add meal and recipe icons when clicked
                          HStack{
  
                              Button(action: {
                                  angle += 90
                                  showAddViews.toggle()
  
                              }) {
  
                                  if showAddViews {
                                      VStack{
                                          AddToolbar(showAddOptions: $showAddViews)
                                              .offset(y:-50)
                                      }
  
                                  }
  
                              Image(systemName: &quot;plus.square&quot;)
                                  .opacity(showAddViews ? 0.5 : 1)
                                  .font(.largeTitle)
                                  .foregroundColor(.black)
                                  .rotationEffect(.degrees(angle))
                                  .animation(.easeIn(duration: 0.25), value: angle)
                          }
                      }
                  }
              }
          }
      }
  }
  </code></pre>
  <p><strong>Buttons that appear  when toolbar is pressed</strong></p>
  <pre><code> struct AddToolbar: View {
      
      @Binding var showAddOptions: Bool
      @State var showMealView = false
      
      var body: some View {
          
          HStack{
              VStack{
                  Button(action: {
                      showMealView.toggle()
                  }){
                      VStack{
                  Image(systemName: &quot;square.and.pencil&quot;)
                      .font(.title)
                      .foregroundColor(.black)
                      .background(Circle()
                          .fill(.gray)
                          .frame(width:50, height:50))
                      .padding(3)
                  
                  Text(&quot;Meal&quot;)
                      .foregroundColor(.black)
                      }
                  }.fullScreenCover(isPresented: $showMealView){
                      JournalEntryMain()
                  }
              }
              VStack{
                  Image(systemName: &quot;text.book.closed&quot;)
                      .foregroundColor(.black)
                      .font(.title)
                      .background(Circle()
                          .fill(.gray)
                          .frame(width:50, height:50))
                      .padding(3)
                  
                  Text(&quot;Recipe&quot;)
                      .foregroundColor(.black)
                  }
              .offset(y: -50)
              }
          .frame(height:150)
          }
      }
  </code></pre>
  <p><strong>Desired Effect</strong>
  <a href="https://i.stack.imgur.com/nI1r9.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/nI1r9.png" alt="enter image description here" /></a></p>