Center alignment in row of LazyVGrid

I am creating a LazyVGrid with 2 columns. I want it so that if there is only one item in a row, then it goes to the center of the row. I tried using an HStack with a Spacer, but it doesn't push it to the center. How do I do it?

                ForEach(pets) { pet in
                    VStack {
                        Image(pet.species.rawValue)
                            .resizable()
                            .frame(width: 80, height: 80)
                        
                        Text(pet.name)
                            .poppinsBold(size: 16)
                    }
                }
                
                HStack {
                    if pets.hasEvenNumber {
                        Spacer(minLength: 0)
                    }
                    
                    Button {
                        addPetSheet = true
                    } label: {
                        VStack {
                            ZStack {
                                Circle()
                                    .frame(width: 70, height: 70)
                                    .foregroundStyle(.gray)
                                
                                Image(systemName: "plus")
                                    .foregroundStyle(.white)
                                    .font(.title)
                            }
                            
                            Text("Add")
                                .poppinsBold(size: 16)
                        }
                    }
                }
                
            }