2013-06-17 13 views
7

Napisałem kod, w którym wyświetlam obrazy w GridView, ale teraz chcę pokazać tekst na dole każdego obrazu.Jak wyświetlić tekst na obrazku?

i chcę pokazać moją siatkę tak:

enter image description here

ale coraz tak [też chcą pokazać tekstu do obrazu]:

enter image description here

głównym. xml:

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    > 
    <GridView 
     android:id="@+id/gridview" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:verticalSpacing="0dp" 
     android:horizontalSpacing="0dp" 
     android:stretchMode="columnWidth" 
     android:numColumns="2" 
     /> 
</FrameLayout> 
+0

co jest tu pytania? –

+2

utwórz niestandardowy układ elementu GridView i umieść w nim obraz + TextView i zapełnij je w swoim adapterze. – hardartcore

+0

Zgadzam się z @ Android-Developer – Chetan

Odpowiedz

7

Musisz zdefiniować niestandardowy układ elementów siatki, który zawiera widok tekstowy, aby przypisać tekst.

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" > 
    <ImageView 
     android:id="@+id/thumbnail" 
     android:padding="8dp" 
     android:scaleType="cropCenter" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" /> 
    <TextView 
     android:id="@+id/title" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:padding="10dp" 
     android:layout_gravity="bottom" 
     android:textColor="@android:color/white" 
     android:background="#55000000" /> 
</FrameLayout> 

Tutaj stworzyliśmy FrameLayout który ma ImageView ustawić, aby dopasować wymiary rodzica, będzie to ImageView który wyświetla zdjęcia. Następnie znajduje się TextView, który będzie używany do wyświetlania tytułu elementu i który jest wyrównany do dolnej krawędzi FrameLayout.

Następnie musimy edytować adapter, aby użyć tego układu elementów siatki i wyrenderować poprawne informacje.

public View getView(int position, View convertView, ViewGroup parent) { 

    // Inflate the single grid item layout 
    if (convertView == null) { 
     convertView = mLayoutInflater.inflate(R.layout.grid_item, parent, false); 
    } 

    // Set Image 
    ImageView thumbnail = convertView.findViewById(R.id.thumbnail); 
    if (thumbnail != null) { 
     thumbnail.setImageResource(mThumbIds[position]); 
    } 

    // Set Text 
    TextView title = convertView.findViewById(R.id.title); 
    if (title != null) { 
     title.setText("Image Number: " + position); 
    } 

    return convertView;  
} 

mLayoutInflater powinny być ogólnie zdefiniowane w konstruktorze przy użyciu

mLayoutInflater = LayoutInflater.from(context); 
+0

To byłby najskuteczniejszy sposób robienia tego, co chcesz , ponieważ używanie niestandardowego adaptera umożliwia zawracanie widoków i dostosowywanie zawartości. –