1
00:00:00,700 --> 00:00:02,705
For the song's current time and duration,

2
00:00:02,705 --> 00:00:06,295
I created a style called PlaybackTimeStyle
and wrapped the height and width.

3
00:00:20,125 --> 00:00:25,663
Then I gave it that nice light gray color,
a size of 18sp and a normal typeface.

4
00:00:44,546 --> 00:00:48,512
I'll apply this new style to the two text
views in the playback controls layout in

5
00:00:48,512 --> 00:00:50,161
the same exact manner as before.

6
00:01:22,315 --> 00:01:23,697
Now the tricky part.

7
00:01:23,697 --> 00:01:27,800
Styling this image view with the rounded
corners looks easy on first inspection.

8
00:01:27,800 --> 00:01:29,190
But applying an attribute for

9
00:01:29,190 --> 00:01:32,760
a custom view in styles can
potentially cause quite the headache.

10
00:01:32,760 --> 00:01:35,640
In our layout XML,
we normally prepend attributes for

11
00:01:35,640 --> 00:01:40,780
custom views,
in our case riv_corner_radius,

12
00:01:40,780 --> 00:01:44,810
with the app namespace, which we
specify at the top of our layout file.

13
00:01:44,810 --> 00:01:47,670
However, when we move this
custom attribute to a style,

14
00:01:47,670 --> 00:01:51,619
the trick we need is to not include
the custom name's face declaration at all.

15
00:01:54,092 --> 00:01:58,079
I know this may seem counter intuitive,
but let's create the style, apply it, and

16
00:01:58,079 --> 00:02:00,340
then run the app to verify
that it indeed works.

17
00:02:33,804 --> 00:02:35,602
Whoops I spelled the,

18
00:02:35,602 --> 00:02:41,384
obviously its not the rix_corner_radius
its riv_corner_radius.

19
00:02:41,384 --> 00:02:47,709
Let me go back into styles, fix that typo
and we'll run the app one more time.

20
00:02:56,547 --> 00:02:59,099
Awesome, it still works and
now if we wanted,

21
00:02:59,099 --> 00:03:04,180
we could reuse that style in other images
that we wanted to have rounded corners.

22
00:03:04,180 --> 00:03:07,770
As a bonus, I wanna show you a cool
trick that Android Studio can do to make

23
00:03:07,770 --> 00:03:10,720
refactoring our layouts
through styles even easier.

24
00:03:10,720 --> 00:03:14,240
If you have a view with a bunch of
attributes, you can right click it,

25
00:03:14,240 --> 00:03:18,900
then select Extract Style from the Extract
menu, give it a name, and voila.

26
00:03:18,900 --> 00:03:21,980
The IDE will automatically create
the style without you having to think

27
00:03:21,980 --> 00:03:23,170
about anything.

28
00:03:23,170 --> 00:03:26,840
It won't pick up certain attributes, but
we can add those in manually if we know,

29
00:03:26,840 --> 00:03:30,290
for example, that we're only going to
use this style in a constraint layout.

30
00:03:30,290 --> 00:03:33,920
I'll demonstrate this process in the tool
bar style from the settings activity so

31
00:03:33,920 --> 00:03:35,510
you can see it in action.

32
00:03:35,510 --> 00:03:39,845
As I mentioned, Android Studio won't
automatically grab the layout constraint

33
00:03:39,845 --> 00:03:42,306
attributes, so I'll add those in manually.

34
00:03:42,306 --> 00:03:46,765
I'll use the ever-so-handy selection by
columns to create three item opening and

35
00:03:46,765 --> 00:03:49,604
closing tags for
each respective layout attribute.

36
00:03:49,604 --> 00:03:52,451
And then I'll use the same column
selection by clicking Alt, and

37
00:03:52,451 --> 00:03:55,268
dragging the mouse to select all
three lines of the attributes.

38
00:03:57,230 --> 00:03:58,861
Then I'll hold Alt + Shift and

39
00:03:58,861 --> 00:04:03,020
click the right arrow to highlight the
entire attribute name and cut them out.

40
00:04:04,120 --> 00:04:05,689
Clicking and holding Alt again and

41
00:04:05,689 --> 00:04:08,015
dragging to select all
three columns of item tags,

42
00:04:08,015 --> 00:04:11,550
I'll paste in the attributes and
repeat the process for their given values.

43
00:04:15,353 --> 00:04:17,391
That was a mouthful.

44
00:04:17,391 --> 00:04:19,661
Please let me know if you have
any questions about that and

45
00:04:19,661 --> 00:04:21,232
we'll be sure to help you understand.

46
00:04:21,232 --> 00:04:25,259
For more information about column
selection, and text selection shortcuts in

47
00:04:25,259 --> 00:04:28,457
Android Studio, based on IntelliJ,
see the teachers notes.

48
00:04:28,457 --> 00:04:31,888
Now that you've created your own style and
learned a nice shortcut to easily create

49
00:04:31,888 --> 00:04:35,466
them from your existing layouts, feel free
to explore more of the styles I've created

50
00:04:35,466 --> 00:04:37,840
for the app, and
see if you can picture what they'll do.