1

00:00:00,360 --> 00:00:07,470

Hired Le'Veon in this tutorial you're going to actually learn about firebase authentication in Android.



2

00:00:07,650 --> 00:00:11,050

So let's create a new Android studio project.



3

00:00:11,340 --> 00:00:18,210

So the application name is going to be firebase of integration and you can specify the company domain



4

00:00:18,210 --> 00:00:20,700

the package name and the project location.



5

00:00:20,700 --> 00:00:29,150

So just click next and he choose AP A16 Android 4.1 jelly bean as the minimum SDK for phone and tablet.



6

00:00:29,280 --> 00:00:35,970

So just click on next and here choose A.E. activity next so don't change anything.



7

00:00:35,970 --> 00:00:39,180

Make sure the activity activity name is main activity.



8

00:00:39,180 --> 00:00:42,420

Make sure to generate a layout file layout.



9

00:00:42,420 --> 00:00:46,990

Name is activity underlying main and the backwards compatibility is actually checked.



10

00:00:47,250 --> 00:00:48,430

Let's click on finish.



11

00:00:48,540 --> 00:00:50,310

So let's wait a little bit here.



12

00:00:50,340 --> 00:00:56,450

So now that the project is created Let's go to this activity underline minute example here.



13

00:00:56,550 --> 00:01:00,260

Let's design the user interface of this application here.



14

00:01:00,390 --> 00:01:05,130

So let's select this hello world takes you here and then press on your keyboard.



15

00:01:05,130 --> 00:01:08,650

Now I'm going to double click on this tab here in order to make this area wider.



16

00:01:08,670 --> 00:01:16,720

So first of all of Vini to actually add a text view here to this kind of strange layout here.



17

00:01:16,950 --> 00:01:18,030

So let's add it here.



18

00:01:18,090 --> 00:01:23,210

Now as you can see are these constraints are actually created automatically here.



19

00:01:23,230 --> 00:01:29,260

Select is text rule for the ID just assign the value to the name.



20

00:01:29,500 --> 00:01:34,770

You don't have to provide an ID for this takes you because you are not going to actually interact with



21

00:01:34,770 --> 00:01:35,160

the text.



22

00:01:35,160 --> 00:01:36,580

View from our job codes.



23

00:01:36,960 --> 00:01:39,690

But I actually provided an idea here for this.



24

00:01:39,750 --> 00:01:47,820

So let's take this case again and for the text attribute here just typing here and name name of the



25

00:01:47,820 --> 00:01:52,620

user name of the user colon and then person until your keyboard.



26

00:01:52,620 --> 00:01:55,180

So now let's try an edit.



27

00:01:55,260 --> 00:01:58,780

Or a text field into this constraint play out.



28

00:01:58,830 --> 00:02:06,290

So inside this palette section here you can see that you have these actually this text here.



29

00:02:06,390 --> 00:02:14,860

Just click on it and then select a plain text and drag this plain text here into this a constraint.



30

00:02:14,880 --> 00:02:18,280

And besides this takes you here.



31

00:02:18,390 --> 00:02:24,990

So now that we have this edit i see it we can see that the constraints are not created for this it takes



32

00:02:25,020 --> 00:02:25,910

automatically.



33

00:02:26,040 --> 00:02:28,780

So we need to add the constraints ourselves.



34

00:02:28,860 --> 00:02:31,080

So it's actually positioned it here.



35

00:02:31,110 --> 00:02:38,610

Let's also position our Takes here so that it is in alignment with this edit text and select Edit edit



36

00:02:39,000 --> 00:02:43,460

so you can see it a constraint is actually created to the top of the view here.



37

00:02:43,680 --> 00:02:47,190

And another constraint is created to the right edge of this view.



38

00:02:47,280 --> 00:02:54,060

So let's create a constraint to this actually to the right of this text view.



39

00:02:54,060 --> 00:03:02,190

Let's create a constraint from the left edge of this text to the right of this takes view so that this



40

00:03:02,280 --> 00:03:07,050

space is actually maintained in all the different views.



41

00:03:07,050 --> 00:03:10,380

So as you can see we have this little circle that is pulsating.



42

00:03:10,380 --> 00:03:18,020

Just select and drag this constraint here to the right edge of this takes view and then release it.



43

00:03:18,480 --> 00:03:25,560

So here you can see that and I select this it takes here the left margin is 8 right.



44

00:03:25,560 --> 00:03:27,300

So let's change you to number 10.



45

00:03:27,390 --> 00:03:28,890

And now I think it's good.



46

00:03:29,190 --> 00:03:32,190

So let's now let's select this as it takes.



47

00:03:32,190 --> 00:03:38,070

Now we need to pro-white an ID for this as takes because we want to interact with these editrix from



48

00:03:38,090 --> 00:03:39,310

October codes.



49

00:03:39,360 --> 00:03:44,150

So the idea is going to be EDT NE or idiotcy entail.



50

00:03:44,160 --> 00:03:45,210

Name it.



51

00:03:45,240 --> 00:03:49,190

Enter name and then press enter on your keyboard.



52

00:03:49,590 --> 00:03:58,530

So now select Edit takes here and for the text attribute here let's actually delete this value and we



53

00:03:58,530 --> 00:04:05,730

can actually provide a hint for this editor but it is not needed to provide a hint for this text because



54

00:04:06,330 --> 00:04:13,980

we put this text view here in order to specify that the user is needed to provide the name of the user.



55

00:04:14,000 --> 00:04:16,700

Here inside is the text.



56

00:04:16,830 --> 00:04:19,880

So let's try another text view here.



57

00:04:19,890 --> 00:04:23,270

We can actually select this takes you at this as it takes here.



58

00:04:23,550 --> 00:04:25,360

So let's go to design tab.



59

00:04:25,440 --> 00:04:27,930

Just hold down the shift key on your keyboard.



60

00:04:27,960 --> 00:04:34,680

Select is text and this edit text and then you can right click here and you can click on copy or you



61

00:04:34,680 --> 00:04:39,540

can just if you are using a Windows machine you can hold down the control on your keyboard and then



62

00:04:39,540 --> 00:04:41,420

press the letters on your keyboard.



63

00:04:41,850 --> 00:04:48,780

Or you can actually if you are using Windows or a Mac you can hold out the Comanche on your keyboard



64

00:04:49,140 --> 00:04:52,090

and then press on the letter c key on your keyboard.



65

00:04:52,290 --> 00:04:57,100

So now let's actually let's run this application first.



66

00:04:57,110 --> 00:04:58,620

First on the application.



67

00:04:58,830 --> 00:05:01,860

Now let's select this device here and then click on OK.



68

00:05:02,130 --> 00:05:07,440

So here you can see that the application is running on this device and you can see that everything is



69

00:05:07,710 --> 00:05:10,570

actually positioned correctly we have the name of the user.



70

00:05:10,770 --> 00:05:11,990

And these are added text.



71

00:05:12,000 --> 00:05:13,710

So let's go back to android studio.



72

00:05:13,860 --> 00:05:20,220

Now let's again let's actually copy this to user interface components here.



73

00:05:20,310 --> 00:05:26,690

Let's copy these two user interface components and let's actually paste them here again.



74

00:05:26,850 --> 00:05:28,760

So if you are using a Windows machine.



75

00:05:28,980 --> 00:05:33,240

Just hold on the controller here on your keyboard and then present that it will reach you on your keyboard.



76

00:05:33,240 --> 00:05:37,860

And if you are using a match you just need to hold down the comment here on your keyboard and then press



77

00:05:37,860 --> 00:05:39,570

on that is that the key on your keyboard.



78

00:05:39,870 --> 00:05:44,510

So now these two user interface components are copied and pasted.



79

00:05:44,630 --> 00:05:48,230

So many to actually select them and put it here.



80

00:05:48,290 --> 00:05:50,570

We do these selective editing and put it here.



81

00:05:50,700 --> 00:05:54,510

These tapes and selectees takes you and put it here.



82

00:05:54,510 --> 00:05:58,300

Below is a test view and besides edit text.



83

00:05:58,380 --> 00:06:02,320

So now you can see we have these two user interface components.



84

00:06:02,320 --> 00:06:04,390

Select is text view.



85

00:06:04,680 --> 00:06:10,510

And we don't have to provide an ID for this text view but we need to change the text of this text view.



86

00:06:10,770 --> 00:06:13,380

So the text is going to be a..



87

00:06:13,380 --> 00:06:21,180

Or we can say email the e-mail of the user or email of the user colon and that person on your keyboard.



88

00:06:21,180 --> 00:06:23,880

So now let's selective editing.



89

00:06:24,180 --> 00:06:34,330

And for the ID here just EDT enter email and then press enter key on your keyboard so you can see that



90

00:06:34,400 --> 00:06:37,770

these constraints are actually already created.



91

00:06:37,990 --> 00:06:45,700

But I want to create a constraint to the bottom edge of this that it takes not to the top edge of this



92

00:06:45,700 --> 00:06:53,050

view you can see that the constraint from the top of the text to the top edge of this view.



93

00:06:53,080 --> 00:06:56,320

Here you can see that a constraint is created here.



94

00:06:56,320 --> 00:06:57,950

I don't want this constraint.



95

00:06:57,970 --> 00:06:59,270

So just select this.



96

00:06:59,530 --> 00:07:01,780

Just click on this constraint in order to delete it.



97

00:07:01,780 --> 00:07:04,820

You can see now that the constraint is actually deleted.



98

00:07:05,020 --> 00:07:05,580

Right.



99

00:07:05,780 --> 00:07:10,260

So now we can actually create a constraint through the body of these editors.



100

00:07:10,360 --> 00:07:16,120

So let's get this click on this just sort of this little circle that is pulsating and this create a



101

00:07:16,120 --> 00:07:16,680

constraint.



102

00:07:16,720 --> 00:07:19,140

The bottom edge of this edit text.



103

00:07:19,150 --> 00:07:24,080

Now let's actually increase the top margin of this.



104

00:07:24,140 --> 00:07:24,680

It takes.



105

00:07:24,720 --> 00:07:26,220

Let's change it to number 10.



106

00:07:26,280 --> 00:07:30,820

Here inside these properties section and the president of Kenya keyboard.



107

00:07:31,000 --> 00:07:39,040

Now you can see that are actually on to my action so you can see that a constraint is created from the



108

00:07:39,250 --> 00:07:44,310

left edge of this eddy takes to the right of this one of these editors.



109

00:07:44,310 --> 00:07:47,180

Yet at the top I don't want this kind of strength.



110

00:07:47,200 --> 00:07:53,780

I want a constraint from the left edge here from the left edge of this text to the right edge of this



111

00:07:54,010 --> 00:07:55,210

it takes view.



112

00:07:55,390 --> 00:07:59,240

So let's click on this constraint in order to delete it.



113

00:07:59,260 --> 00:08:04,210

Now I can create another constraint to write each of these takes.



114

00:08:04,210 --> 00:08:09,160

So just click on this little circle that is pulsating and just write this constraint to the right edge



115

00:08:09,490 --> 00:08:11,330

of these takes you.



116

00:08:11,500 --> 00:08:12,710

Now let's.



117

00:08:12,730 --> 00:08:16,260

Actually you can see that the left margin is 8 right.



118

00:08:16,270 --> 00:08:19,000

If I said I did it last Yet the left margin is 10.



119

00:08:19,000 --> 00:08:25,530

So it's also for consistency purposes let's assign the value number 10 for the Lipp left margin of this



120

00:08:25,720 --> 00:08:30,080

text here and then press on your keyboard.



121

00:08:30,080 --> 00:08:33,340

So now everything is fine.



122

00:08:33,640 --> 00:08:37,000

Now that we have these two user interface components here.



123

00:08:37,180 --> 00:08:37,840

So let's.



124

00:08:37,840 --> 00:08:44,070

Again let's actually copy these to user interface components so just select them.



125

00:08:44,530 --> 00:08:48,450

And then again copy them and paste them.



126

00:08:48,460 --> 00:08:51,190

So let's actually dragged them here.



127

00:08:51,310 --> 00:09:00,070

So here you can see that a constraint is created from the top edge of this text to the bottom edge of



128

00:09:00,130 --> 00:09:01,320

this as it takes here.



129

00:09:01,330 --> 00:09:05,490

So I don't want these constraints so if I want to delete it I just need to click on this constraint



130

00:09:05,490 --> 00:09:05,940

here.



131

00:09:06,070 --> 00:09:11,950

I just need to click on this little circle that is pulsating in red color and now again I can create



132

00:09:12,040 --> 00:09:15,430

another constraint to the bottom edge of these text.



133

00:09:15,570 --> 00:09:16,220

Right.



134

00:09:16,300 --> 00:09:21,890

So you can see that this little circle that is pulsating just create a constraint to the bottom edge



135

00:09:21,910 --> 00:09:22,840

of this as it takes.



136

00:09:22,840 --> 00:09:25,950

And for the top margin of this it it takes assigned a value.



137

00:09:25,990 --> 00:09:26,850

Number ten.



138

00:09:27,090 --> 00:09:27,650

OK.



139

00:09:27,850 --> 00:09:33,810

Now that we have this editrix here let's actually look at this one.



140

00:09:33,810 --> 00:09:39,220

This constraint here on the left of this text takes that is created to the right of this view.



141

00:09:39,220 --> 00:09:41,160

So again I don't want this constraint.



142

00:09:41,170 --> 00:09:47,920

So just click on it and now let's create a constraint to the right edge of this takes you.



143

00:09:48,120 --> 00:09:51,360

So now that the constraint is created if I click on it it takes.



144

00:09:51,360 --> 00:09:53,730

Here you can see that the top margin is not change.



145

00:09:53,730 --> 00:09:54,780

It is still number 10.



146

00:09:54,780 --> 00:09:56,010

So let's actually change it again.



147

00:09:56,010 --> 00:09:58,170

I think it is a walk in Android studio.



148

00:09:59,250 --> 00:10:01,590

So now now I think it's changed.



149

00:10:01,590 --> 00:10:03,080

If I click on it they can select it.



150

00:10:03,080 --> 00:10:04,320

Now it's number nine.



151

00:10:04,320 --> 00:10:06,210

So it is not changing.



152

00:10:06,630 --> 00:10:08,620

I don't know why.



153

00:10:08,640 --> 00:10:11,660

So let's actually change it manually.



154

00:10:12,360 --> 00:10:13,950

So now it is number 15.



155

00:10:13,950 --> 00:10:19,290

So let's actually position it here in alignment with these other texts.



156

00:10:19,300 --> 00:10:22,910

And now for the top Margene here let's change it to number 10.



157

00:10:23,130 --> 00:10:25,180

And here we have this text view.



158

00:10:25,200 --> 00:10:25,470

So



159

00:10:28,340 --> 00:10:29,630

now I think it's good.



160

00:10:29,830 --> 00:10:30,280

OK.



161

00:10:30,490 --> 00:10:35,710

So let's actually think position it here in alignment with this it it takes and I think it's good.



162

00:10:36,040 --> 00:10:38,860

So that we have the name of the user e-mail of the user.



163

00:10:38,860 --> 00:10:48,020

So let's also change the text of this takes butu to the passport of the user password and then present



164

00:10:48,020 --> 00:10:49,240

it to the Kenyan keyboard.



165

00:10:49,240 --> 00:10:52,020

So let's select this it takes here.



166

00:10:52,320 --> 00:10:54,240

And for the idea just they've been here.



167

00:10:54,260 --> 00:10:55,220

EDT.



168

00:10:55,630 --> 00:11:02,450

Enter password and that person entered channel cuple So we have EDT enter name it enter.



169

00:11:02,620 --> 00:11:09,800

So we haven't actually changed the actually the ID of this eddy take solace.



170

00:11:09,840 --> 00:11:10,910

So that is a detail.



171

00:11:10,950 --> 00:11:12,900

And for the idea just open it.



172

00:11:13,480 --> 00:11:22,010

Enter email and then present it on your keyboard and then click on yes and select it it is here and



173

00:11:22,010 --> 00:11:23,510

you can see that the ID is EDT.



174

00:11:23,510 --> 00:11:27,210

Enter password so if we have these takes views.



175

00:11:27,210 --> 00:11:29,800

So now let's run our application.



176

00:11:29,820 --> 00:11:36,590

Let me show you the emulator so I can see that we have the name of the user e-mail of the user and the



177

00:11:36,590 --> 00:11:37,580

password of that user.



178

00:11:37,580 --> 00:11:43,410

So you can see that these user interface components are not in alignment with each other.



179

00:11:43,670 --> 00:11:46,940

So let's go back to android studio and let's solve this problem.



180

00:11:47,000 --> 00:11:53,540

So first of all let's select these for the user interface components just select them and just put put



181

00:11:53,540 --> 00:11:54,260

them here.



182

00:11:54,410 --> 00:11:58,790

First let's align these to use any interface components here.



183

00:11:58,820 --> 00:12:07,940

First of all let's actually position this as it takes here and this one here and now we can actually



184

00:12:08,390 --> 00:12:09,490

select this one.



185

00:12:09,490 --> 00:12:16,350

This takes you here and let's position it here and let's say this it takes and let's position it here



186

00:12:18,040 --> 00:12:18,630

OK.



187

00:12:19,010 --> 00:12:24,290

And let's also select this takes you let's position it here and now.



188

00:12:24,590 --> 00:12:25,250

OK.



189

00:12:25,250 --> 00:12:30,850

So you can see that a constraint is actually created from the left edge of this.



190

00:12:30,860 --> 00:12:33,240

It takes to the right of this takes you.



191

00:12:33,290 --> 00:12:40,340

So I think it is mistakenly created I don't know it may be a bug or a constraint or maybe a little bit



192

00:12:40,400 --> 00:12:41,120

buggy.



193

00:12:41,270 --> 00:12:46,880

So let's click on this a little circle that is pulsating on the left of this it takes and let's create



194

00:12:46,880 --> 00:12:48,250

a constraint to that right.



195

00:12:48,300 --> 00:12:49,930

Of this takes you.



196

00:12:50,560 --> 00:12:57,500

OK so now that we actually created this constraint here let's align them here.



197

00:12:57,500 --> 00:13:01,490

So now let's run the application.



198

00:13:01,510 --> 00:13:03,280

Let me show you the emulator.



199

00:13:03,280 --> 00:13:09,710

So now I think they're good but we can actually still change the place of these two once of these any



200

00:13:09,790 --> 00:13:12,040

of these it takes views actually.



201

00:13:12,040 --> 00:13:18,910

So let's we can actually click on these selectors editrix and you can see this AB here right.



202

00:13:18,910 --> 00:13:19,800

Just click on it.



203

00:13:20,110 --> 00:13:22,230

And here we can see these.



204

00:13:22,270 --> 00:13:30,250

This one here that is in the green color just selected and dredger constraint to this takes you here



205

00:13:30,330 --> 00:13:31,280

right.



206

00:13:31,330 --> 00:13:35,240

It is going to actually create on an alignment constraint here.



207

00:13:35,500 --> 00:13:36,650

It just takes view.



208

00:13:36,820 --> 00:13:45,070

So again select this text and click on this one he had a B and here you can see this one here that is



209

00:13:45,070 --> 00:13:53,550

pulsating in green color and actually just drag it to this and it takes you and select this text here.



210

00:13:53,570 --> 00:14:00,040

Click on AB and just click on this one here and drag a constraint to this text.



211

00:14:00,050 --> 00:14:01,680

This takes three actually.



212

00:14:01,690 --> 00:14:04,240

So now let's run the application again.



213

00:14:04,360 --> 00:14:07,860

So now as you can see that it is a little bit better.



214

00:14:08,380 --> 00:14:14,050

So here if I type in something inside these edit takes here for example something you can see that the



215

00:14:14,050 --> 00:14:18,810

text inside this text is in alignment with this takes you here.



216

00:14:19,000 --> 00:14:23,420

And that's because of this alignment constraints that he actually created here.



217

00:14:23,530 --> 00:14:24,720

Right.



218

00:14:24,790 --> 00:14:25,490

So that's it.



219

00:14:25,510 --> 00:14:30,400

Let's go back to Andrew and let's add two more buttons here into this.



220

00:14:30,410 --> 00:14:35,740

The constraint lay out so in this pilot's actions we can all answer like a Spartan and just strike it



221

00:14:35,750 --> 00:14:40,890

here and let's select the spot and here again and just put it here.



222

00:14:42,510 --> 00:14:44,240

So we have another button here.



223

00:14:44,250 --> 00:14:45,510

Right.



224

00:14:45,510 --> 00:14:48,850

So now let's select this spot here.



225

00:14:49,200 --> 00:14:59,150

And for the ID here just type in here PTEN sign up BT and sign up and select this button here.



226

00:14:59,290 --> 00:15:05,160

And for the to just they can hear Pythian sign in and that person entered Chanute keyboard.



227

00:15:05,310 --> 00:15:08,600

So let's change the position of these patents here.



228

00:15:08,730 --> 00:15:10,820

I think it would be better in this way.



229

00:15:10,980 --> 00:15:15,980

So now I want to disputant this and sign in to take the entire week here.



230

00:15:16,110 --> 00:15:19,440

So select the spot in and for their video constraint here.



231

00:15:19,440 --> 00:15:21,460

Change it to match constraints.



232

00:15:22,100 --> 00:15:27,650

And now let's actually create a constraint to the left edge of this screen.



233

00:15:27,660 --> 00:15:29,410

So let's delete it first.



234

00:15:29,610 --> 00:15:35,280

And let's actually create another constraint here to the left of the screen and let's create another



235

00:15:35,460 --> 00:15:37,590

kind of straight to the right edge of the screen.



236

00:15:38,440 --> 00:15:42,710

So select this button again let's change the text of this button here.



237

00:15:43,060 --> 00:15:49,030

So the text is going to be sign in signing and then press on until your keyboard.



238

00:15:49,090 --> 00:15:49,880

So you can see it.



239

00:15:49,900 --> 00:15:52,420

Now I can actually change it the taste.



240

00:15:52,420 --> 00:15:58,720

And it says sign at St. streambed slash app name it may be a bug in the new version of Android studio.



241

00:15:58,720 --> 00:16:05,420

You may not encounter this kind of bug but I need to actually type my value again.



242

00:16:06,300 --> 00:16:07,650

So it is actually changed.



243

00:16:07,650 --> 00:16:09,190

Now that takes this signing.



244

00:16:09,600 --> 00:16:11,830

So now let's select this button here again.



245

00:16:11,850 --> 00:16:13,950

I want this one to take the entire week.



246

00:16:14,160 --> 00:16:17,860

So now it is put an ad for the constraint here.



247

00:16:17,880 --> 00:16:20,900

Just click on it and change it to match constraints.



248

00:16:20,940 --> 00:16:22,910

Let's delete this right constraint here.



249

00:16:22,920 --> 00:16:23,920

Click on it.



250

00:16:23,940 --> 00:16:29,680

Now let's create another constraint here to the right edge of this view of the screen and create a constraint



251

00:16:29,680 --> 00:16:33,200

to the left edge of this view and select the spot.



252

00:16:33,450 --> 00:16:36,000

So for the text to step in here sign



253

00:16:39,780 --> 00:16:40,740

so that's it sign in.



254

00:16:40,740 --> 00:16:44,380

Sign up now here.



255

00:16:44,550 --> 00:16:46,730

This is the user interface of the application.



256

00:16:46,950 --> 00:16:53,590

So let's go back to our main activity class here and let's actually call that the application.



257

00:16:53,790 --> 00:16:56,380

So that's enough for this tutorial in the next story.



258

00:16:56,410 --> 00:16:58,410

We're going to continue building this application.



259

00:16:58,620 --> 00:16:59,760

Thank you very much for watching.



260

00:16:59,760 --> 00:17:03,960

If you have any questions please post a discussion in the course and then I'll do my best to answer



261

00:17:04,020 --> 00:17:05,240

all of your questions.