###### tags: `fh` `MAD`
# Learning Diary 3
## Fragments + Activities

Please watch Lesson 3 of the Udacity Course "Developing Android Apps with Kotlin" and implement the example App from the course. Answer the following questions and submit this document as your learning diary 3.

Udacity Course "Developing Android Apps with Kotlin", Lesson 3 (1/2)

1. Explain how Fragments in Android work. Include the terms "Back Stack", "Fragment Manager Class" and "onCreateView" in your explanation (approx. 200 words). Please also show example code snippets.
(1 point)
Fragments are parts of activities. Each fragment can be seen as a scene on your stage within the activity. They are a more lightweight alternative to using multiple activites and are saved on a so called back stack. If you go to fragment B from fragment A, fragment B just overlaps fragment A. So when you go back using the "UpButton" fragment B gets popped of the "BackStack" and you see the fragment below again which would be fragment A.
Each Fragment needs its own class and layout file.
The Fragment Manager Class is used in the logic part of the app, the MainActivity. It takes care of which fragment is shown at what point or which action shows which fragment.
For example. The code below would show Fragment B when clicking on the corresponding Button:

btnFragmentB.setOnClickListener{
    supportFragmentManager.beginTransaction().apply {
        replace(R.id.flFragment, fragment_b)
        addToBackStack(null)
    }
}

The addToBackStack line saves the previous fragment on the Backstack so that it can be called upon later using the "UpButton"
The function onCreateView() is responsible for inflating and returning the view of the current fragment. It looks something like this:

override fun onCreateView(
    inflater:LayoutInflater, container: ViewGroup?,
    savedInstanceState: Bundle?
    ): View?{
    return inflater.inflate(R.layout.fragment_first, container, false)
    }

2. Explain how Navigation in Android works. Include the terms “Principles of Navigation”, “Navigation Editor”, “Navigation Graph”, “Navigation Drawer” and “Back Stack Manipulation” (approx. 300 words). Please also show an example different from the one given in the course.
(1 point)
Navigation in android refers to how the user "moves" through the app. The developer can determine how this looks by creating a navigation graph in the navigation editor. This mighty tool enables the developer to create the base structure of an app with a few clicks while also providing a good overview. It also displays how each fragment is connected to others. When creating this graph the developer should keep in mind the Principles of Navigation:
* There's always a starting place: the first and last view the user sees on their screen(with the exception of apps that require login)
* you can always go back: all fragments should be on the BackStack, allowing the user to always get back to where he came from.
* up goes back: similar to the previous rule but including that the back button of the phone has the same function as the UpButton in the app while the app is running.
Usually a user can get to the previous fragment by clicking the UpButton or the backButton on his device. But in some cases this is not desireable. Then the developer may use BackStack manipulation to display a specific fragment and delete all saved fragments in between from the BackStack.
Another useful tool is the Navigation Drawer which provides the user with a few selected destinations to navigate toward. This is usefull in complex apps. The drawer can accessed either bei swiping from left to right or by clicking the "burger icon" if it is available. The drawer itself usually consists of a header which can contain a logo, and a list of the destinations.

3. Please document step-by-step your implementation of the example Trivia App from the course. Include screenshots as well as reflections on your main learnings and major difficulties (4-7 screenshots + 500-1.000 words)
(3 points)

The first thing i notice since i didnt clone the apps from the previous exercises before (if that was possible), was that it takes time for the AndroidStudio to load everything correctly. The guide spoke of ToDos and i didn't see them immediately so i started googling but after a while noticed that the ToDos had appeared. Patience seems to be the key sometimes. (or maybe i just overestimated my computer). But then i noticed it only ever was the ToDos in the Readme and they didnt actually changed when i changed branch but since the code was still in a state where i could work on it i ignored that and started working.

I find the concept of fragments very clever and by visualizing it for the programmer witht the navigation graph it helps to keep an overview and makes some steps easier opposed to as if you would hardcode everything manually. I had to go through the video a few times to get the feeling that i understood it but some unclear parts will clear up once i start on my own app i think. For example i wonder where all the code comes from that gets tossed in your face in this exercise.

I only noticed the part with the screenshots at exercise 3 so here is a screenshot of that:

like previously mentioned i like this concept a lot and the general ease of how to implement a condition like that is awesome.

For the exercise with backstack manipulation i encountered a curious bug (or made a mistake i dont know). Where in the kotlin code the id of the navigation graphs would not be recognised as seen in my screenshot:
But curiously enough it compiled and worked anyway.

In the next step the shortcut ctrl+o blew my mind. I was allways wondering if there is such a list of available functions to override.

menue part:
For exercise 7 i was hindered by the fact that the videos appearently are a bit older and the gradlefiles are different now. Ich searched every file but was not able to find where to put the dependencie via classpath.
luckily i was able to continue anyway by checking out the next step from the repo and synchronizing gradle.
The exercise with sharing was a little bit much at once so i had to watch it a few times but in the end it worked out


I feel like just adding screenshots of the code isnt realy what you want so ill leave it at that. The remaining exercises did not throw any questions a few google sessions couldnt answer. I hope thats okay.

Open Questions (2/2)
Please list any open questions.

## Notes

**Action Bar**
Appears at the top of the application screen.Contains applications branding and navigation features such as the overlow menue and the application drawer button.

**UpButton**
Appears in the action bar and takes us back through previous screens the user has navigated to within the app.

**OverflowMenue**
A drop down list of items within the Action Bar that can contain navigation destinations.

**NavigationDrawer**
A menue with a header that slides out from the side of the app.

**NavigationGraph**
All of the destinations -- the screens that can be navigated to from a single activity are contained in this.

Fragments:
introduced to support more dynamic and flexible UI designs on large screens (tablets)

Activity: Frame containing UI fragments and provides UI elements sourrounding the fragment.
UI fragments: operate like a view within the activitys layout but require a subclass (like an activity) of a fragment which creates a layout where you can put UI logic

Navigation:
Possible between Activities OR Fragments of Activities

BackStack:
In welcher Reihenfolge was geöffnet/aufgerufen wurde & entsprechend in Vorder- oder Hintergrund liegt.
Kann es für Activites oder auch einzelne Fragments geben (wird dann durch Fragment Manager kontrolliert).