How to Add active Web links and a ScrollView - Part two

In this post we are completing our ScrollView example, this is part two, in which we are going to know how to Add active Web links and a ScrollView. As a brief summary in Android ScrollView sample post, we have created a sample program that use RelativeLayout to allign several TextView of different puposes; TextViews for an article title, subtitle, and lengthy article text.

In this post, we will learn how to align a TextView inside a ScrollView, in case that your text is longer than your screen.

 


Add the autoLink attribute for active web links

Add the android:autoLink="web"attribute to the article TextView. The XML code for this TextView should now look like

this:

<TextView
    android:id="@+id/article"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:autoLink="web"

 

Add a ScrollView to the layout

To make a view (such as a TextView) scrollable, embed the view inside a ScrollView.
1. Add a ScrollView between the article_subheading TextView and the article TextView. As you enter <ScrollView,
Android Studio automatically adds </ScrollView> at the end, and presents the android:layout_width and
android:layout_height attributes with suggestions. Choose wrap_content from the suggestions for both attributes.
The code should now look like this:

<TextView
    android:id="@+id/article_subheading"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@id/article_heading"
    android:padding="@dimen/padding_regular"
    android:text="@string/article_subtitle"
    android:textAppearance="@android:style/TextAppearance" />

<ScrollView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@id/article_subheading">

    <TextView
        android:id="@+id/article"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:autoLink="web"
        android:lineSpacingExtra="@dimen/line_spacing"

 

2. Move the ending </ScrollView> code after the article TextView so that the article TextView attributes are inside
the ScrollView XML element.

3. Remove the following attribute from the article TextView, because the ScrollView itself will be placed below the
article_subheading element, and this attribute for TextView would conflict with the ScrollView:

android:layout_below="@id/article_subheading"

4. Choose Code > Reformat Code to reformat the XML code so that the article TextView now appears indented inside
the <Scrollview> code.
5. Run the app.
Swipe up and down to scroll the article. The scroll bar appears in the right margin as you scroll.
Tap the web link to go to the web page. The android:autoLink attribute turns any recognizable URL in the TextView
(such as www.orcaes.co ) into a web link.
6. Rotate your device or emulator while running the app. Notice how the scrolling view widens to use the full display and
still scrolls properly.
7. Run the app on a tablet or tablet emulator. Notice how the scrolling view widens to use the full display and still scrolls
properly.

The following figure shows how we imbeded the text inside string.xml resoure. The text could come from different sources, as you know, Database, cloud, files, etc

String text in String resource File

 


Download full Application

For your convenience, you can download the full Application to your pc, and try to run it and modify it in your PC

 


Further Reading

In the following listing you might find these articles useful

 


Share it

Facebook Twitter Google+