Show Tweets¶

TweetUi Kit provides TweetViews to render Tweets in your app via code or in XML.

Features

Two variants to choose from:

TweetView: Standard Tweet view with photo forward.

CompactTweetView: Tweet view with cropped photo, for use in list displays.

Tweet action buttons (favorite, share) can optionally be enabled.

Tap Tweet view to open Tweet permalink using default url intent.

Note

Tweets can be rendered using user authentication or guest authentication. The TweetUtils helpers perform guest authentication automatically.

Tweet Views¶

The TweetUi kit provides the TweetView and CompactTweetView views for rendering Tweets. The view constructors take a context, the Tweet to be rendered, and an optional style.

Tweets can be requested through the TwitterCore Tweet API with a valid session (e.g. from a user login) or without a token through TweetUi’s TweetUtils. Here is an example using TweetUtils to load Tweets and construct Tweet views in the success callback.

// EmbeddedTweetsActivity
import com.twitter.sdk.android.core.Callback;
import com.twitter.sdk.android.core.models.Tweet;
import com.twitter.sdk.android.core.TwitterException;
import com.twitter.sdk.android.tweetui.TweetUtils;
import com.twitter.sdk.android.tweetui.TweetView;
...

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_embedded_tweets);

    final LinearLayout myLayout
            = (LinearLayout) findViewById(R.id.my_tweet_layout);

    final List<Long> tweetIds = Arrays.asList(510908133917487104L);
    TweetUtils.loadTweets(tweetIds, new Callback<Tweet>() {
        @Override
        public void success(Result<Tweet> result) {
            for (Tweet tweet : result.data) {
                myLayout.addView(new TweetView(EmbeddedTweetsActivity.this, tweet));
            }
        }

        @Override
        public void failure(TwitterException exception) {
            // Toast.makeText(...).show();
        }
    });
}

With a valid session, the API StatusesService can be used to load Tweets. TweetViews and CompactTweetViews can be constructed and added in the API callback success.

Note

With Fragments, be sure to check that the getActivity() context argument to the Tweet view constructor in the success callback is non-null.

XML¶

The TweetView and CompactTweetView can be inflated from an XML layout as well. For this usage, the tw__tweet_id attribute must specify the Tweet id and the Tweet will be loaded and rendered upon inflation.

<!--my_tweet_activity.xml-->

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:twittersdk="http://schemas.android.com/apk/res-auto">

    <com.twitter.sdk.android.tweetui.TweetView
        android:id="@+id/bike_tweet"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        twittersdk:tw__tweet_id="510908133917487104"/>

</FrameLayout>

Note

You must use the layout parameters android:layout_width="match_parent" and layout_height="wrap_content".

Tweet Actions¶

Tweet views have the option to show Tweet action buttons (favorite, share). By default, actions are disabled but may be enabled by setting tw__tweet_actions_enabled property or calling BaseTweetView#setTweetActionsEnabled(boolean). For convenience tw__TweetLightWithActionsStyle and tw__TweetDarkWithActionsStyle styles are provided for enabling actions (See: Styling). The favorite action uses the user session to perform the favorite. If no user session is available, the action will do nothing. By setting an action callback which handles TwitterAuthException failures, you could launch your login flow so that when the user returns to the Tweet view, the favorite action succeeds.

Here is an example that shows enabling actions and setting an action callback that will start some login activity if a user session isn’t present.

// EmbeddedTweetActivity.java
import com.twitter.sdk.android.tweetui.TweetView;
...

// launch the login activity when a guest user tries to favorite a Tweet
final Callback<Tweet> actionCallback = new Callback<Tweet>() {
    @Override
    public void success(Result<Tweet> result) {
       // Intentionally blank
    }

    @Override
    public void failure(TwitterException exception) {
        if (exception instanceof TwitterAuthException) {
            // launch custom login flow
            startActivity(LoginActivity.class);
        }
    }
};

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_embedded_tweet);

    final LinearLayout myLayout
            = (LinearLayout) findViewById(R.id.my_tweet_layout);

    final long tweetId = 510908133917487104L;
    TweetUtils.loadTweet(tweetId, new Callback<Tweet>() {
        @Override
        public void success(Result<Tweet> result) {
            final TweetView tweetView = new TweetView(EmbeddedTweetsActivity.this, result.data,
                    R.style.tw__TweetDarkWithActionsStyle)
            tweetView.setOnActionCallback(actionCallback)
            myLayout.addView(tweetView);
        }

        @Override
        public void failure(TwitterException exception) {
            // Toast.makeText(...).show();
        }
    });
}

Styling¶

The TweetUi kit provides four Android styles tw__TweetLightStyle, tw__TweetLightWithActionsStyle, tw__TweetDarkStyle, and tw__TweetDarkWithActionsStyle. The light style is used by default.

The desired style may be specified in the view’s constructor.

// EmbeddedTweetActivity.java
import com.twitter.sdk.android.tweetui.TweetView;
...

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_embedded_tweet);

    final LinearLayout myLayout
            = (LinearLayout) findViewById(R.id.my_tweet_layout);

    final long tweetId = 510908133917487104L;
    TweetUtils.loadTweet(tweetId, new Callback<Tweet>() {
        @Override
        public void success(Result<Tweet> result) {
            myLayout.addView(new TweetView(EmbeddedTweetsActivity.this, result.data,
                    R.style.tw__TweetDarkWithActionsStyle));
        }

        @Override
        public void failure(TwitterException exception) {
            // Toast.makeText(...).show();
        }
    });
}

A dark style TweetView with Tweet actions enabled.

For Tweet views in XML, the style may be set by the standard @style attribute.

<!--my_tweet_activity.xml-->

<com.twitter.sdk.android.tweetui.TweetView
    android:id="@+id/city_hall_tweet"
    style="@style/tw__TweetDarkWithActionsStyle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    twittersdk:tw__tweet_id="521061104445693952"/>

Custom Styling¶

TweetView and CompactTweetView respect custom style attributes to change the way a Tweet looks:

tw__container_bg_color - the background color of the Tweet
tw__primary_text_color - the Tweet text color and author name color
tw__action_color - the color of links in Tweet text
tw__tweet_actions_enabled - show or hide Tweet actions

The provided styles set these custom attributes to fixed values. To customize the style of a Tweet view further, the easiest approach is to extend one of the existing styles.

<!--styles.xml-->

<style name="CustomLightTweetStyle" parent="tw__TweetDarkStyle">
    <item name="tw__primary_text_color">@color/custom_color_1</item>
    <item name="tw__action_color">@color/custom_color_2</item>
</style>

Alternately, you may create a theme or a style that sets one or more of the custom attributes. A theme can be applied to the application or activities while a style can be applied to individual views.

<!--styles.xml-->

<style name="CustomStyle">
    <item name="tw__container_bg_color">@color/custom_color_1</item>
    <item name="tw__primary_text_color">@color/custom_color_2</item>
</style>

<style name="CustomTheme" parent="android:Theme.Holo.Light">
    <item name="tw__container_bg_color">@color/custom_color_1</item>
</style>

If a Tweet view renders and one of the custom style attributes is not set, the value defaults to the tw__TweetLightStyle‘s value.