Android, Bagaimana membatasi lebar TextView (dan menambahkan tiga titik di akhir teks)?

317

Saya punya TextViewyang ingin saya batasi karakternya. Sebenarnya, saya bisa melakukan ini tetapi hal yang saya cari adalah bagaimana menambahkan tiga titik (...) di akhir string. Ini menunjukkan teks telah berlanjut. Ini adalah XML saya tetapi tidak ada titik meskipun membatasi teks saya.

<TextView 
        android:id                      = "@+id/tvFixture"
        android:layout_width            = "wrap_content"
        android:layout_height           = "wrap_content"
        android:layout_toLeftOf         = "@id/ivFixture_Guest"
        android:text                    = "@string/test_06"
        android:lines                   = "1"
        android:ems                     = "3"
        android:gravity                 = "right"
        style                           = "@style/simpletopic.black" 
        android:ellipsize="end"/>
Hesam
sumber

Jawaban:

693

Usang:

Tambahkan satu properti lagi android:singleLine="true"di Textview Anda

Diperbarui:

android:ellipsize="end" 
android:maxLines="1"
Mohammed Azharuddin Shaikh
sumber
3
Pasti perlu singleLine ketika saya baru saja mencoba ini. Meskipun dikatakan usang.
EGHDK
41
android: singleLine = "true" sudah usang dan memiliki efek samping yang buruk. gunakan android: ellipsize = "end" dan maxLine = "1" sebagai gantinya
Hamidreza Hosseinkhani
1
Apa "efek samping buruk" dari penggunaan singleLine? Lihat juga: Apakah atribut xml singleLine sudah tidak digunakan lagi di Android?
Suragch
1
btw, android: maxLines bisa lebih besar dari 1 jika Anda mau :)
Touré Holder
1
Adakah yang mendapat pesan ini "W / StaticLayout: maxLineHeight tidak boleh -1. MaxLines: 1 lineCount: 1">?
ICE DINGIN
157

Berikut ini adalah apa yang saya pelajari dengan bermain-main dengan berbagai opsi untuk memaksa TextViewsatu baris (dengan dan tanpa tiga titik).

masukkan deskripsi gambar di sini

android: maxLines = "1"

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:maxLines="1"
    android:text="one two three four five six seven eight nine ten" />

Ini hanya memaksa teks ke satu baris. Teks tambahan disembunyikan.

Terkait:

ellipsize = "end"

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:maxLines="1"
    android:ellipsize="end"
    android:text="one two three four five six seven eight nine ten" />

Ini memotong teks yang tidak sesuai tetapi membuat pengguna tahu bahwa teks telah terpotong dengan menambahkan ellipsis (tiga titik).

Terkait:

ellipsize = "marquee"

<TextView
    android:id="@+id/MarqueeText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:maxLines="1"
    android:singleLine="true"
    android:ellipsize="marquee"
    android:focusable="true"
    android:focusableInTouchMode="true"
    android:text="one two three four five six seven eight nine ten" />

Ini membuat teks menggulir secara otomatis melintasi TextView. Perhatikan bahwa kadang - kadang perlu diatur dalam kode:

textView.setSelected(true);

Seharusnya android:maxLines="1"dan android:singleLine="true"pada dasarnya harus melakukan hal yang sama dan karena singleLine tampaknya sudah usang saya lebih suka untuk tidak menggunakannya, tetapi ketika saya mengeluarkannya, tenda tidak gulir lagi. Mengambil maxLinestidak mempengaruhi itu.

Terkait:

Lihat HorizontalScrollView dengan scrollHorizontally

<HorizontalScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/horizontalScrollView">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:maxLines="1"
        android:scrollHorizontally="true"
        android:text="one two three four five six seven eight nine ten" />
</HorizontalScrollView>

Ini memungkinkan pengguna untuk menggulir secara manual untuk melihat seluruh baris teks.

Suragch
sumber
Tapi ini hanya elips pada akhir setiap kata. Apakah ada cara untuk menambahkan ... di tengah ruang yang sangat_long_word_without_whites ...?
Tobias Reich
@TobiasReich, saya tidak tahu ada cara untuk melakukannya. Anda bisa membuatnya sendiri menggunakan Paint.measureText .
Suragch
Kadang-kadang Anda mungkin perlu aplikasi: layout_constrainedWidth = "true" juga
Dan Crisan
80

Coba properti TextView ini di file tata letak Anda ..

android:ellipsize="end"
android:maxLines="1"
Niranj Patel
sumber
31

Saya menganggap Anda ingin membatasi lebar untuk satu baris dan tidak membatasi berdasarkan karakter? Karena singleLinesudah usang, Anda dapat mencoba menggunakan yang berikut ini bersama-sama:

android:maxLines="1"
android:scrollHorizontally="true"
android:ellipsize="end"
Muz
sumber
13

misalnya. kamu bisa memakai

android:maxLength="13"

ini akan membatasi panjang texview hingga 13 tetapi masalahnya adalah jika Anda mencoba menambahkan 3 titik (...), itu tidak akan menampilkannya, karena itu akan menjadi bagian dari panjang textview.

     String userName;
     if (data.length() >= 13) {
            userName = data.substring(0, 13)+ "...";

     } else {

            userName = data;

    }
        textView.setText(userName);

terlepas dari ini, Anda harus menggunakan

 android:maxLines="1"
Nayanesh Gupte
sumber
2
Anda sebaiknya menggunakan "\ u2026" daripada "..."
Zharro
ini hanya sebagai contoh. jika saya meletakkan string di Strings.xml maka pasti saya memilih unicodes. Adakah alasan khusus yang ingin Anda taruh di sini?
Nayanesh Gupte
2
Nggak. Saya pribadi baru-baru ini mengetahui keberadaan karakter ini di Unicode dan memutuskan untuk membagikan pengetahuan ini;)
Zharro
6

Menggunakan

  • android:singleLine="true"
  • android:maxLines="1"
  • app:layout_constrainedWidth="true"

Begini TextViewpenampilan lengkap saya :

    <TextView
    android:id="@+id/message_title"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="5dp"
    android:maxLines="1"
    android:singleLine="true"
    android:text="NAME PLACEHOLDER MORE Text"
    android:textColor="@android:color/black"
    android:textSize="16sp"

    android:textStyle="bold"
    app:layout_constrainedWidth="true"
    app:layout_constraintEnd_toStartOf="@id/message_check_sign"
    app:layout_constraintHorizontal_bias="0"
    app:layout_constraintStart_toEndOf="@id/img_chat_contact"
    app:layout_constraintTop_toTopOf="@id/img_chat_contact" />

Gambar <code> TextView </code>

kyrylo_23
sumber
5

Saya menggunakan Horizonal Recyclerview.
1) Di sini, di CardView, TextView terdistorsi secara vertikal saat menggunakan

android:ellipsize="end"
android:maxLines="1"

Periksa Grup Wyman TextViews yang berani, Jaskolski ... masukkan deskripsi gambar di sini

2) Tapi ketika saya menggunakan singleLine dan ellipsize -

android:ellipsize="end"
android:singleLine="true"

Periksa Grup Wyman TextViews yang berani, Jaskolski ... masukkan deskripsi gambar di sini

Solusi 2 bekerja untuk saya dengan benar (menggunakan singleLine). Saya juga telah menguji dalam versi OS: 4.1 dan di atas (hingga 8.0), itu berfungsi dengan baik tanpa crash.

Varad Mondkar
sumber
4

kode:

TextView your_text_view = (TextView) findViewById(R.id.your_id_textview);
your_text_view.setEllipsize(TextUtils.TruncateAt.END);

xml:

android:maxLines = "5"

misalnya

Dalam Matius 13, para murid bertanya kepada Yesus mengapa Ia berbicara kepada orang banyak dalam perumpamaan. Dia menjawab, "Telah diberikan kepadamu untuk mengetahui misteri kerajaan surga, tetapi bagi mereka itu belum diberikan.

Keluaran: Dalam Matius 13, para murid bertanya kepada Yesus mengapa Ia berbicara kepada orang banyak dalam perumpamaan. Dia menjawab, "Sudah diberikan kepada Anda untuk tahu ...

kehancuran3936
sumber
4

Saya mendapatkan hasil yang diinginkan dengan menggunakan

android:maxLines="2"
android:minLines="2"
android:ellipsize="end"

Triknya adalah mengatur maxLines dan minLines ke nilai yang sama ... dan Bukan hanya android: lines = "2", jangan lakukan triknya. Anda juga menghindari atribut yang sudah usang.

pengguna1974433
sumber
4

Anda perlu menambahkan baris berikut ke tata letak Anda untuk tampilan teks

android:maxLines="1"
android:ellipsize="end"
android:singleLine="true"

Semoga ini berhasil untuk Anda.

Mayank Bhatnagar
sumber
3

Anda dapat membatasi jumlah karakter tampilan teks Anda dan menambahkan (...) setelah teks. Misalkan Anda perlu menunjukkan 5 huruf saja dan setelah itu Anda perlu menunjukkan (...), Lakukan saja yang berikut ini:

String YourString = "abcdefghijk";

if(YourString.length()>5){

YourString  =  YourString.substring(0,4)+"...";

your_text_view.setText(YourString);
}else{

 your_text_view.setText(YourString); //Dont do any change

}

sedikit hack ^ _ ^. Padahal itu bukan solusi yang baik. Tetapi sebuah pekerjaan yang berhasil bagi saya: D

EDIT: Saya telah menambahkan cek untuk karakter kurang sesuai no terbatas Anda. karakter.

TheLittleNaruto
sumber
3

Dalam rangka untuk bekerja dengan android: ellipsize atribut, Anda harus membatasi lebar tata letak dari TextView , sehingga teks di luar batas dari pandangan dari TextView.

Jadi, atribut android: layout_width memainkan peran kunci di sini, atur sesuai.

Salah satu contohnya adalah:

<TextView        
    android:layout_width="120dp"
    android:layout_height="wrap_content"
    android:ellipsize="end"
    android:text="This is a very long text to be displayed"
    android:textSize="12sp"
    android:maxLines="1"            
     />

Sekarang, di sini jika teks di android: text = "Ini adalah teks yang sangat panjang untuk ditampilkan" tidak terlihat dari TextView dengan android: layout_width = "120dp" , android: ellipsize = "end" akan memotong teks dan tempat ... (3 titik) setelah itu. yaitu ini sangat panjang ... akan ditampilkan di TextView.

Androwed
sumber
2

Saya pikir Anda memberi tinggi dan lebar tampilan teks fix. Maka solusi Anda akan berhasil.

Vinay Kumar Baghel
sumber
2

Anda dapat menulis baris ini dalam xml tempat Anda mengambil textview:

android:singleLine="true"
Jay Thakkar
sumber
2

Pendekatan @AzharShaikh berfungsi dengan baik.

android:ellipsize="end"
android:maxLines="1"

Tapi saya menyadari ada masalah bahwa TextView akan dipotong oleh kata (secara default). Tampilkan jika kami memiliki teks seperti:

uji long_line_without_any_space_abcdefgh

TextView akan menampilkan:

uji...

Dan saya menemukan solusi untuk mengatasi masalah ini, ganti spasi dengan karakter unicode no-break space, itu membuat TextView membungkus karakter alih-alih kata-kata:

yourString.replace(" ", "\u00A0");

Hasil:

uji long_line_without_any_space_abc ...

Pikirkan Kode Dua Kali Sekali
sumber
2
        <TextView
            android:id="@+id/product_description"
            android:layout_width="165dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="2dp"
            android:paddingLeft="12dp"
            android:paddingRight="12dp"
            android:text="Pack of 4 summer printed pajama"
            android:textColor="#d2131c"
            android:textSize="12sp"
            android:maxLines="2"
            android:ellipsize="end"/>
kamran rahmatullah
sumber
1

Tambahkan dua baris ini dalam teks Anda

android:ellipsize="end"
android:singleLine="true"
SANJAY GUPTA
sumber
0

Anda dapat melakukannya dengan xml:

<TextView 
    android:id="@+id/textview"
    android:maxLines="1" // or any number of lines you want
    android:ellipsize="end"
    />
Khalid Taha
sumber
Bagaimana saya bisa menggunakan 3 Dots@ end dengan maxLength="35"solusi apa pun?
Sagar
-1

Anda baru saja mengubah ...

android:layout_width="wrap_content"

Gunakan baris di bawah ini

android:layout_width="match_parent"

.......

   <LinearLayout
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_centerVertical="true"
       android:layout_marginLeft="10dp"
       android:layout_marginTop="10dp"
       android:layout_toRightOf="@+id/visitBox"
       android:orientation="vertical" >

             <TextView
                  android:id="@+id/txvrequestTitle"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:singleLine="true"
                  android:text="Abcdefghighiklmnon"
                  android:textAppearance="? 
                  android:attr/textAppearanceLarge"
                  android:textColor="@color/orange_color" />

   </LinearLayout>
KeTaN
sumber
singleLine sudah tidak digunakan lagi
Nick