Okay, let's continue where we left off in the last video. To finish this TextView
we need to go into the all attributes pane and set layout_marginTop to 8 dp.
You'll probably want to put a copyright message in your About
dialogues, and I've added this one to show you one way of doing it, not because
I'm imposing copyright restrictions on you. All the code in this course is made
available to you, on the same license terms as the icon license that we saw,
when downloading the clock icon. You're free to do pretty much anything you want
with it, except pass it off as your own. If you want to use the AppDialog class
in your own apps, for example, that's fine. We have written it to be reusable after all.
If you want to base your own app on one of the ones in this course, that's
also fine. If it's substantially unchanged, then add a credit to the
course with the course URL. The next TextView is called about_weblink,
and it's also said to have a layout_width of match_parent
and a layout_height of wrap_ content.
Set the textColor to colorPrimary
then create a new string resource called about_weblink.
The string for this resource will be, Instructions available at www.learnprogramming.academy
Once again we'll set the layout_marginTop property to 8dp
and there's another change we need to make for this widget. We want the link to
be clickable, so scroll up to find the autoLink property and expand it.
You can see there are a few things you can make Android respond to, in your TextViews.
If you tick phone, for example, then the user can launch the phone dialer by tapping a
phone number in the TextView. We want web for this widget.
The URL is highlighted in the TextView and tapping it when the app's running will launch a
browser to that address, sort of. There's a bit more we'll have to add, to cater for
older Android versions. We'll come to that later. Now that we've got the autoLink
property on the screen, click the next widget in the component tree.
Android Studio now keeps the last used property visible in the list, which is great if
you want to set the same property on a series of widgets. Use the component
tree to select the widget, while keeping the extended properties pane open, and you
don't have to keep scrolling around to find the property. Of course, they change
these features all the time, so that if it doesn't behave like that when you're
watching these videos, you might still have to scroll around to find the
property again. As you can see, although it keeps autoLink on the screen, it does
close it back up. This TextView will have an email address,
so expand autoLink and tick email.
We may as well set the layout marginTop while
we're in the all attributes, so once again set it to 8dp.
Back in the top section,
the ID will be about_email.
Once again, we'll have a layout width of match_parent and the layout
height of wrap_content, and the textColor will be colorPrimary.
The new string resource will be called about_email,
and the string value will be, For support, email taskTimer@learnprogramming.academy
The final TextView will be called about_credits,
with a layout width of match_parent and a layout height
of wrap_content. Change the textColor to colorPrimary,
then create a new string resource called about_credits
with the value, Icon derived from analog clock at openclipart.org by the b tag again,
and then close the b tag. I'm using the HTML bold tag in the string, to highlight the
icon name and the source. It's very limited but you can do basic formatting
in TextView's text. At the moment, you can use the bold, italic and underline tags.
All the tags available are mentioned in the documentation
developer.android.com/guide/topics/resources/string-resource.html
and you can get to the appropriate heading by searching for markup.
It's the first result on the page.
If you want to include more complex HTML, the
doc describes how to format your code so you can use the fromHtml function,
but we'll stick to bold here.
We just need to set the layout_marginTop to 8dp,
and we're almost done with the TextViews.
Unfortunately, there's another slight hiccup with the text we've entered.
This time Android Studio's noticed that we've used HTML tags, and it wraps the text in
what's called a CData attribute. Instead of nice bold text, we're getting the bold
tags displayed. We fix this by editing the res/values/strings.xml again,
and cleaning up the text inside the string tag. Remove everything from the
less than symbol to the square bracket at the beginning,
and the two square brackets and greater than sign at the end. The HTML bold tags should be bold in
the text, which makes it easier to make sure you've typed them correctly.
You won't see the text emboldened in the design preview, but at least we haven't
got the HTML tags displaying.
Now if you've read through the dialog design
documentation, you'll know that Google recommends that all dialog text should
be 24dp from the edges of the dialog. Rather than setting a left and right
margin on each widget, we can add padding to the layout itself.
Click on LinearLayout in the component tree and expand the properties pane.
If you're including everything in the layout, so the icon and the title as well,
then you could just set the padding attribute to give the same amount of
padding all the way around. We're letting Android add the icon and title, and we
don't want a huge gap between them and the rest of our layout. That means we
don't want any padding at the top of the layout. Everything else should be set to
24dp, but not the padding top property.
So we'll start with the padding bottom. Click the symbol next to that,
then type dialog in the search field. The one we want is dialogPreferredPadding.
Then click OK.
We want to use the same value for the end and start padding.
Copy that to the clipboard, then click the end and start
attributes to paste it in. Remember, don't set the top padding.
One last change is to make sure the layout width for the layout is set to match parent,
and the layout height is wrap content,
and that's our layout finished.
In the next video, we'll display the dialog in our app.
See you for the next one.