-1

I know this has been asked before, but the solution in that post did not work for me.

I'm just beginning to learn Android programming and was doing a mock up. It displays correctly in Android Studio but not on my device. The images and background color display correctly but none of the text displays. I've tried changing the font and fontColor. What needs to be changed?

I had another example that used ReleativeLayout and it displays correctly but this ConstraintLayout does not.

The first image is from AS and the other is from my device.

Android Studio Screenshot

Device Screenshot

This is the code from activity_main

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/listLayout"
    android:layout_width="wrap_content"
    android:layout_height="248dp"
    android:layout_marginEnd="4dp"
    android:layout_marginStart="4dp"
    android:layout_marginTop="4dp"
    tools:context="com.vijer.test1.MainActivity">
    <!-- First Group -->
    <View
        android:id="@+id/group_one"
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:background="@android:color/darker_gray"
        app:layout_constraintLeft_creator="@id/listLayout"
        app:layout_constraintTop_creator="@id/listLayout" />

    <ImageView
        android:id="@+id/album_art1"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:contentDescription="@string/image_description"
        android:src="@drawable/image1"
        app:layout_constraintLeft_creator="@id/listLayout"
        app:layout_constraintTop_toTopOf="@id/listLayout" />

    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintEnd_toEndOf="parent" />

    <TextView
        android:id="@+id/meta_artist1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintLeft_toRightOf="@id/album_art1"
        app:layout_constraintTop_toTopOf="@id/listLayout"
        tools:text="@string/tag_artist1" />

    <TextView
        android:id="@+id/meta_title1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintLeft_toRightOf="@id/album_art1"
        app:layout_constraintTop_toBottomOf="@id/meta_artist1"
        tools:text="@string/tag_title1" />

    <TextView
        android:id="@+id/meta_album1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintLeft_toRightOf="@id/album_art1"
        app:layout_constraintTop_toBottomOf="@id/meta_title1"
        tools:text="@string/tag_album1" />

    <TextView
        android:id="@+id/meta_time1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        android:layout_marginStart="4dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintEnd_toStartOf="@+id/meta_delimiter1"
        app:layout_constraintTop_toBottomOf="@id/meta_title1"
        tools:text="@string/tag_length1" />

    <TextView
        android:id="@+id/meta_delimiter1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        android:layout_marginStart="4dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintEnd_toStartOf="@+id/meta_file_type1"
        app:layout_constraintTop_toBottomOf="@id/meta_title1"
        tools:text="@string/tag_delimiter" />

    <TextView
        android:id="@+id/meta_file_type1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        android:layout_marginTop="4dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="@+id/meta_time1"
        app:layout_constraintEnd_toEndOf="@+id/listLayout"
        tools:text="@string/tag_file_type1" />

    <!-- Second Group -->

    <View
        android:id="@+id/group_two"
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:layout_marginTop="4dp"
        android:background="@android:color/darker_gray"
        app:layout_constraintLeft_toLeftOf="@id/listLayout"
        app:layout_constraintTop_toBottomOf="@id/group_one"
        tools:layout_editor_absoluteX="0dp" />

    <ImageView
        android:id="@+id/album_art2"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_marginTop="4dp"
        android:contentDescription="@string/image_description"
        android:src="@drawable/image2"
        app:layout_constraintLeft_toLeftOf="@id/listLayout"
        app:layout_constraintTop_toBottomOf="@id/group_one" />

    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintEnd_toEndOf="parent" />

    <TextView
        android:id="@+id/meta_artist12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintLeft_toRightOf="@id/album_art2"
        app:layout_constraintTop_toBottomOf="@id/group_one"
        tools:text="@string/tag_artist2" />

    <TextView
        android:id="@+id/meta_title12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:layout_marginTop="30dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintLeft_toRightOf="@id/album_art2"
        app:layout_constraintTop_toBottomOf="@id/group_one"
        tools:text="@string/tag_title2" />

    <TextView
        android:id="@+id/meta_album12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:layout_marginTop="56dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintLeft_toRightOf="@id/album_art2"
        app:layout_constraintTop_toBottomOf="@id/group_one"
        tools:text="@string/tag_album2" />

    <TextView
        android:id="@+id/meta_time12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        android:layout_marginStart="4dp"
        android:layout_marginTop="56dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintEnd_toStartOf="@+id/meta_delimiter12"
        app:layout_constraintTop_toBottomOf="@id/group_one"
        tools:text="@string/tag_length2" />

    <TextView
        android:id="@+id/meta_delimiter12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        android:layout_marginStart="4dp"
        android:layout_marginTop="56dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintEnd_toStartOf="@+id/meta_file_type12"
        app:layout_constraintTop_toBottomOf="@id/group_one"
        tools:text="@string/tag_delimiter" />

    <TextView
        android:id="@+id/meta_file_type12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        android:layout_marginTop="56dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"

        app:layout_constraintBottom_toBottomOf="@+id/meta_time12"
        app:layout_constraintEnd_toEndOf="@+id/group_one"
        tools:text="@string/tag_file_type2" />

    <!-- Third Group -->
    <View
        android:id="@+id/group_three"
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:layout_marginTop="4dp"
        android:background="@android:color/darker_gray"
        app:layout_constraintLeft_toLeftOf="@id/listLayout"
        app:layout_constraintTop_toBottomOf="@id/group_two" />

    <ImageView
        android:id="@+id/album_art3"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_marginTop="4dp"
        android:contentDescription="@string/image_description"
        android:src="@drawable/image3"
        app:layout_constraintLeft_toLeftOf="@id/listLayout"
        app:layout_constraintTop_toBottomOf="@id/group_two" />

    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintEnd_toEndOf="parent" />

    <TextView
        android:id="@+id/meta_artist13"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:layout_marginTop="4dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintLeft_toRightOf="@id/album_art3"
        app:layout_constraintTop_toBottomOf="@id/group_two"
        tools:text="@string/tag_artist3" />

    <TextView
        android:id="@+id/meta_title13"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:layout_marginTop="30dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintLeft_toRightOf="@id/album_art3"
        app:layout_constraintTop_toBottomOf="@id/group_two"
        tools:text="@string/tag_title3" />

    <TextView
        android:id="@+id/meta_album13"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:layout_marginTop="56dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintLeft_toRightOf="@id/album_art3"
        app:layout_constraintTop_toBottomOf="@id/group_two"
        tools:text="@string/tag_album3" />

    <TextView
        android:id="@+id/meta_time13"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        android:layout_marginStart="4dp"
        android:layout_marginTop="56dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintEnd_toStartOf="@+id/meta_delimiter13"
        app:layout_constraintTop_toBottomOf="@id/group_two"
        tools:text="@string/tag_length3" />

    <TextView
        android:id="@+id/meta_delimiter13"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        android:layout_marginStart="4dp"
        android:layout_marginTop="56dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintEnd_toStartOf="@+id/meta_file_type13"
        app:layout_constraintTop_toBottomOf="@id/group_two"
        tools:text="@string/tag_delimiter" />

    <TextView
        android:id="@+id/meta_file_type13"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="4dp"
        android:layout_marginTop="56dp"
        android:fontFamily="@font/abeezee"
        android:textColor="#ffffff"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="@+id/meta_time13"
        app:layout_constraintEnd_toEndOf="@+id/group_two"
        tools:text="@string/tag_file_type3" />

</android.support.constraint.ConstraintLayout>
Vijer
  • 123
  • 4
  • 9

2 Answers2

0

Use

android:text="@string/tag_artist1"

Instead of

tools:text="@string/tag_artist1"

Same in all textviews. tools is used to show the text only in developer mode. This helps in testing the UI element while creating the xml

Viswanath Kumar Sandu
  • 2,230
  • 2
  • 17
  • 34
  • Good to know. I see that tools:text is added automatically by Android Studio when you drag a TextView to the design screen. – Vijer Sep 12 '18 at 06:07
0

You have used textviews with tools:text attribute, This will show text only in your android studio design but not on the device.

I would suggest you to keep changes like that. Don't change anything in your xml, only thing you have to do that just set those textviews string from your code.

Read below article about tools and it's usage. https://android.jlelse.eu/tools-attributes-hidden-gems-of-android-studio-d7451b194e0b

Jitesh Mohite
  • 31,138
  • 12
  • 157
  • 147