Changing screen contents by clicking a specific tab

Question

I am using a TabBar in the middle of my screen, there are 4 tabs. I want to change the content above the tabbar when I click on the 3rd tab. for the first 2 tabs I want to show a text with a searchbar and when I click the 3rd or 4th tab I want to replace the text and the searchbar to another text and a row of Weekdays. This is the content I am showing (currently) for all the tabs This is what I want to show when I click the "To Do" or the "Blog" tab

As I am new to Flutter, I have been working for months with the frontend and haven't faced such an issue. so I haven't tried anything.

Here is the main screen where I am displaying the Text and the SearchBar, works fine for the first 2 tabs but I want to change the text and the Searchbar when for the rest of 2 tabs (To Do & Blogs tabs)

This is the TabBar with the Tabs.