Implement custom Facebook like button instead of using Facebook's Default Like Button(LikeView)?

Question

I want to use my custom like button on my android application rather than using default Facebook's Button(LikeView). i am using Facebook SDK for Android. How can i implement custom Like button?

Answer 1

Because it's Android you can customize absolutely everything. For example I have created sample custom LikeView. You can set any color you want but try to consider Facebook convention.

How to do?

Rule as following:
In Android application if you reimplement resource from any SDK it overides it to new value which you set.
I have found these variables from FacebookSdk classes and has overided it on my own application. You can do too.
1. Add following style to your style file and set your own selector. It will overide LikeButton selector

<style name="com_facebook_button_like" parent="com_facebook_button">
    <item name="android:background">@drawable/btn_facebook_like_background_selector</item>
</style> 

2.Add following colors to your color.xml file. Set any color you want.

<color name="com_facebook_likeboxcountview_text_color">#FFFFFFFF</color>
<color name="com_facebook_likeboxcountview_border_color">#FFFFFFFF</color>

Answer 2

It's possible but actually (Facebook SDK 4.14.1), it's tricky and their is no garanty that is working with next SDK version.

First of all, you need to have the LikeView hidden in your layout :

<com.facebook.share.widget.LikeView
    android:id="@+id/likeView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:visibility="gone"/>

In the LikeView, their is a subview : LikeButton.

Their is where the magic appened.

On your own button, set the OnClickListener and use this code :

@Override
public void onClick(View view) {
    //create custom like view
    LikeView likeView = new LikeView(this.mContext);
    //add view to your mainview
    ((ViewGroup) itemView).addView(likeView);
    //configure facebook like with your page'id or URL
    likeView.setObjectIdAndType(this.getSocialAction().getTarget(), LikeView.ObjectType.PAGE);
    //hide this view
    likeView.setVisibility(View.GONE);
    //Inside this likeView, get the Like button
    final LikeButton button = (LikeButton) ((ViewGroup) likeView.getChildAt(0)).getChildAt(0);
    //perform a click on this likebutton
    button.post(new Runnable() {
        @Override
        public void run() {
            button.performClick();
        }
    });
}

After this, when you click on your own button, the likeView appear.