‫Welcome back.
‫We've done with the remote data source repository and the view model.
‫Now let's move to the view part.
‫In this part we're going to design our activity layouts and display the data into UI components.
‫I'll start with the main activity.
‫So go to the layout activity underscore main.
‫And I'll go to the split mode.
‫And I'll start designing my layout.
‫In this example.
‫And in this app I'll use data binding.
‫So for that I need to enable it in the Build.gradle.
‫And here in the Android scope I need to add build features and enable data binding sync.
‫Now then move to the activity underscore main.
‫And here I'll start adding the layout tag.
‫So layout move this layout tag.
‫And this is good.
‫Now I'll move these namespaces and add them here to the layout.
‫And as a part of our layout I'll create inside the drawable and new drawable resource file.
‫This will act as a background for our layout.
‫So I'll name it as gradient underscore back.
‫And we talked about this drawable shapes I transform it into the shape.
‫And here I need to specify the Android shape attribute as rectangular.
‫Then I need to add the gradient.
‫This is my color gradient color and I'll use the corner.
‫I talked about these shapes in the previous video, so please go back to the Drawables lesson to learn
‫more.
‫I'll use this background here, so I'll specify a background attribute to add a drawable gradient back.
‫And this is good.
‫Now let's start designing our views.
‫I'll change this Hello World to a title, so I'll make it as Quiz app.
‫I'll give it an ID text view to margin 200 dpi, size 72 SP and I remove button to button.
‫Okay, so this is our quiz app style would be bold.
‫And the text color.
‫This color okay this is our first text view.
‫The second view is a text view.
‫So.
‫Since our app is a multiple choice, I'll use a radio group.
‫So again, guys, if you have any doubt, please refer to the previous sections to learn about the radio
‫group and radio buttons.
‫Inside this radio group, I'll include four radio buttons, allowing the user to only choose one correct
‫answer.
‫Then outside this radio group and under it I'll create another view of type button wrap content.
‫Wrap content.
‫Its ID is btn button.
‫Next.
‫And the last widget is the text view.
‫And here we go.
‫This is our layout.
‫Congratulations, guys.
‫Also, you can get the layout XML files in the resources folder under this section.
‫So if you want to skip the layout just copy and paste it.
‫You can do it by getting the resource folder.