Having trouble figuring out a sensible place for a button.

Ideal Objectives

• Place the button in an area that is intuitive and makes sense to the user
• Avoid wasting space since that could detract from the mobile experience on smaller screens
• Avoid "hacking" over top of the material design library (Angular Material)
• Remain faithful to Material Design (if feasible)

Problem

• Have a page with group of tabs that pertain to scheduling.
• Also on the page there needs to be a button that enables the user to "Add a Schedule"

Possible Solutions

Place button directly to the right of the tabs

• Pros
  • Relatively easy to do
• Cons
  • A lot of wasted vertical space

(Slight modification would be to float the button over top of the right side of the tabs, but this would be hacking the angular material library and would probably cause a lot of problems with other device screen sizes and maintainability)

Place button on top of tabs

• Pros
  • Relatively easy to do
• Cons
  • A lot of wasted horizontal space

Place button inside each tab

• Pros
  • Button will not waste space
• Cons
  • Harder to implement since each screen will need to have the button added to it.
  • Harder to maintain since developers might forget to add the button to future tabs.

Assumptions

I can think of at least one assumption I am making that perhaps should be questioned. Perhaps there are more assumptions that should be questioned?:

• Add Schedule" should be a button?