Next, we're going to add in two views needed to perform the +1 and

sharing actions.

Let's talk about how these views will work.

The +1 button is bundled with Google Play Services Plus Library.

The +1 button is always associated with some content.

That could be a movie, an app, or in our case, a listing on etsy.

The +1 button shows to the user's followers they recommend the content.

To set the content on the +1 button you supply the URL.

In our case, we're giving it the URL of the listing on Etsy.

This way whether we show the button in an app or

on the web the user's +1 recommendation will be reflected there.

What happens once the user taps the button, is the plus library performs

the plus one action by communicating with the Google+ API.

It does this by calling start activity for result to a Google controlled activity.

To ensure that the button state is correct, you need to initialize the +1

button again, once you think the state may have changed.

We'll need to handle the call to onActivityResult

in our activity when this happens.

Now, let's consider sharing.

Sharing doesn't provide a view in the plus library.

To create a button, I simply use the Android Assets Studio

to generate a share icon using the standard Android iconography.

I provided a link in teacher's notes so you can create an icon yourself.

Once I have a button set up,

I simply set an onClickListener to know when the user wants to share.

Sharing is a standard action on Android and it's done using Intents.

You could create a generic share intent and provide some data along with it.

Using an intent chooser,

we can provide the user the choice of what app they want to share with.

In our app, we're going to use this as a fallback mechanism

when sharing directly to Google+ isn't possible.

Let's take a short break, and then dive into the code and

get these views wired up.

First, let's set up the +1 button.

Let's open up the XML file for our layout and our listing.

Okay, we're gonna add in the +1 button here, and remember,

because it's a custom view, we need to refer to it by the full package name.

So I'm gonna go ahead and put it along with this image ImageView, and

what I'm gonna do is wrap the ImageView and the +1 button and

the share button all around with this relative layout.

And then we're gonna center the buttons over the top of the image view.

So the RelativeLayout will be full width, match_parent.

Height will be wrap_content and then we're gonna put the image view inside.

And then we're gonna add in our PlusOneButton and it's found right where,

com.google.android.gms.plus.PlusOneButton.

So we got our PlusOneButton.

And with our +1 button let's just go ahead and

give it, the minimum size target for touch targets is 48dp.

We're just gonna go and give it 48dp touch target size.

And let's not forget that we want to include an ID here so

that we can reference this later on, listing_plus_one_btn.

And we want to make this +1 one button above the image but to the right.

And it's gonna be next to the share button as well, so let's go ahead and

give it a few rules here.

So first we want to line it on the top and

we want it to align with our sharing button.

But we haven't got an ID for that, cuz we haven't actually created it yet.

So, let's go ahead and use the ID we're gonna use in a minute.

It's gonna be listing_share_btn and we don't have that yet,

so let's go ahead and add that next.

And the share button is actually just gonna be an image button,

so the Google+ Library that's part of

Google+ Services doesn't have a share button included.

I'm just gonna use a regular image button and

I'm just gonna give it an icon that I've generated using Android Assets Studio.

So you can see that I have dropped it right in here under ic_social_share and

we can see what that looks like, it's a standard Android share icon and

I've colored it red.

I use Android Asset Studio to generate this icon for

me, you can go ahead and do that.

Just check out the link in teacher's notes and creat an icon yourself,

I'm gonna go ahead and make this 48dps as well.

The source for this is going to be our drawable, our icon.

And let's make sure we include that id/listing_share_btn.

And now let's go ahead and align this where we want it.

So we'd like this to be in the far top right of our relative layout, so

we're gonna align parent true, and alignParentRight true and

for support, we need to include alignParentEnd true as well.

And now this will be aligned with the top and

we also want it to be to the left of the image button.

So lets do that to the left of listing_share_btn, and

for support, let's make sure we include run to be to the left so

that's gonna be to start of That looks pretty good.

Now this view doesn't have any children, so

I'm just gonna close it using this short hand tag close for XML.

And we can just go ahead and check design view real quick,

and see if this is aligned like we want to and we see that.

Yeah, we're gonna have our image here,

and even though it doesn't show up in the custom view.

You can see the outline of where it'll be measured out there, and our share

button is here as well and that looks pretty good, that's where we want it.

Ok so, now we need to go back to our listing adapter and

we're gonna add these views to our listing holder, so we have a +1 button.

And we also have our image button which is our share button.

Let's go ahead and add these by getting a reference to them from our item,

view we can sure to cast to the appropriate type

That looks pretty good.

And now up here in our onBindViewHolder.

We can actually go ahead and set up these views to show, or be enabled or

not enabled.

So, if Google Play Service is enabled,

we want our listening holder and we want the plus button to be visible.

And if it's not, if Google Play Service is not available, we're gonna go ahead and

not show that, so set visibility to gone.

And we want to initialize it and to initialize it

we need to give it the content that we want to initialize it with.

So +1 button we can call initialize and

what we're gonna do is just get the listing and we're gonna give it the URL.

Now, it's also asking us for an activity request code, so

when you do the plus one action as we discussed.

It's actually gonna call to a Google controlled activity, so

we need to give it some kind of request code to know what is being +1 or not.

And for this, I'm just gonna go and

pass in the value that's actually the position of this item in the list.

And so, we know that's unique and

we'll be able to reference that when it comes back from start activity for result.

It's gonna come back in on activity result and

it'll give us this code back at that point.

Now to ensure that the button looks the way we want it to,

there's several different variations on the +1 button.

And the variation that I wanna use is an annotation and

it's the annotation provided by +1 button.

And there's one, you can have it as a bubble,

you can have it with in lying content or just not.

I'm gonna use none,

that means the +1 button is just gonna show as the plus one button itself.

There's not gonna be any annotations attached to it, and

this will just make it a cleaner UI.

You will simply see the button there next to my share button and

that'll look good for me.

If you wanna include the other annotations,

feel free to do that yourself.

Now that we've set up the +1 button, it looks the way we want,

when the actual +1 button gets tapped, it's initialized.

It's gonna call through to start activity for result,

come back on an activity result in the main activity.

So let's go in here to the main activity, and in here we need to go ahead and

check to see if this is our +1 button coming back to us.

So when the +1 button comes back, it's gonna come to onActivityResult.

And what we wanna do is just make sure that we update the state of the +1 button.

So we're gonna go ahead and call to our adapter and

just say notify dataset changed.

And that's gonna be able to handle redrawing the skate

of the +1 buttons that are visible on the screen.