Hello developers, and welcome to this challenge.
In this challenge, I want from you to create exactly like this UI here.
I have a big border in red color, then I have margin, then I have another border in blue.
I have two texts, one strikethrough and line through and underlined and the other is only underlined.
Moreover, this text is margined from the start.
So take your time, pause the video and try to write your code.
I hope you find the solution.
Otherwise let's code it together inside the greeting composable.
I need to start with the column.
This column contains two composables text one and text two.
I'll start defining the text.
Hello master coding application.
Then I need to define another text.
Download it from Play store.
I'll design the first text.
So here I'll specify the color equals to color dot red.
The font size would be 48 SP.
Always use SP instead of dp with text.
Then I need to add the padding.
So modifier modifier dot padding.
And here I need to specify the padding 16 or 50 dpi whatever you want, but I need to concentrate on
the padding start.
So I'm making sure that you can use the padding correctly.
Font style.
You can use font on Styleitalic and you can use the font family Dot serif.
Okay, but I want to make sure that you can use the padding and you pay attention to the start.
Okay.
Then the second trick I want to make sure that you get it is the text decoration.
And here I need to use text decoration dot combine method.
I need to combine a list of text decorations.
So I need to apply two text decorations for that.
I put it inside a list of and use the combine method line through and text decoration dot underline
so that.
Two tricks in this coding challenge where the modifier padding start and the text decoration, you make
sure that we use the list of because we have two text Decoration the the line through and the underline.
Then let's move to the second text.
The second text text decoration equals to text decoration dot underline okay.
The second text is very simple.
Now to make the borders for the whole column and the whole composable, I need to make sure that I used
the borders and the paddings inside the column.
So here I'll start with the column and I'll start defining some attributes.
Modifier modifier dot padding I'll start with the first padding which is horizontal.
You can specify all equals to 16 dpi.
Then I need to use a border which is six dpi in width and the color will be red.
Then I need to use banding another banding 16 dpi.
Then I need to use a border which is two dpi and the color will be blue.
And the last thing is the padding for DPI.
Okay, so congratulations guys!
We succeeded in building this UI that contains two texts and two borders.
So this challenge was very exciting because we have three tricks.
The first trick was in using the padding with the start.
Make sure you pay attention to it.
And the second trick was using a list of text decoration inside this text, because I need to use the
line through and the underline.
And the third trick was using the padding and border efficiently in order to create two borders with
three paddings.