ตั้งค่าสีของ TextView span ใน Android


206

เป็นไปได้หรือไม่ที่จะตั้งค่าสีของช่วงข้อความใน TextView

ฉันต้องการทำสิ่งที่คล้ายกับแอพ Twitter ซึ่งส่วนหนึ่งของข้อความเป็นสีฟ้า ดูภาพด้านล่าง:

ข้อความแสดงแทน
(ที่มา: twimg.com )

คำตอบ:


429

คำตอบอื่นจะคล้ายกันมาก แต่ไม่จำเป็นต้องตั้งค่าข้อความของTextViewสองครั้ง

TextView TV = (TextView)findViewById(R.id.mytextview01);

Spannable wordtoSpan = new SpannableString("I know just how to whisper, And I know just how to cry,I know just where to find the answers");        

wordtoSpan.setSpan(new ForegroundColorSpan(Color.BLUE), 15, 30, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

TV.setText(wordtoSpan);

แต่ฉันจะเปลี่ยนสีสำหรับคำหลายคำได้อย่างไรฉันข้อความทั้งหมดไม่ใช่หนึ่งช่วง?
Mostafa hashim

1
@mostafahashim สร้างช่วงขยายหลายรายการโดยทำซ้ำบรรทัดที่ 3 wordtoSpan.setSpan (ใหม่ ForegroundColorSpan (Color.RED), 50, 80, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
Ashraf Alshahawy

Kotlin + Spannable String solution จะมีลักษณะเช่นstackoverflow.com/questions/4032676/
Dmitrii Leonov

81

นี่คือฟังก์ชั่นช่วยเหลือเล็กน้อย ยอดเยี่ยมเมื่อคุณมีหลายภาษา!

private void setColor(TextView view, String fulltext, String subtext, int color) {
    view.setText(fulltext, TextView.BufferType.SPANNABLE);
    Spannable str = (Spannable) view.getText();
    int i = fulltext.indexOf(subtext);
    str.setSpan(new ForegroundColorSpan(color), i, i + subtext.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
}

37

ฉันมักพบตัวอย่างที่เป็นภาพเสมอเมื่อพยายามทำความเข้าใจแนวคิดใหม่

สีพื้นหลัง

ป้อนคำอธิบายรูปภาพที่นี่

SpannableString spannableString = new SpannableString("Hello World!");
BackgroundColorSpan backgroundSpan = new BackgroundColorSpan(Color.YELLOW);
spannableString.setSpan(backgroundSpan, 0, spannableString.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
textView.setText(spannableString);

สีพื้นหน้า

ป้อนคำอธิบายรูปภาพที่นี่

SpannableString spannableString = new SpannableString("Hello World!");
ForegroundColorSpan foregroundSpan = new ForegroundColorSpan(Color.RED);
spannableString.setSpan(foregroundSpan, 0, spannableString.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
textView.setText(spannableString);

การรวมกัน

ป้อนคำอธิบายรูปภาพที่นี่

SpannableString spannableString = new SpannableString("Hello World!");
ForegroundColorSpan foregroundSpan = new ForegroundColorSpan(Color.RED);
BackgroundColorSpan backgroundSpan = new BackgroundColorSpan(Color.YELLOW);
spannableString.setSpan(foregroundSpan, 0, 8, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
spannableString.setSpan(backgroundSpan, 3, spannableString.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
textView.setText(spannableString);

การศึกษาต่อ


29

หากคุณต้องการการควบคุมเพิ่มเติมคุณอาจต้องการตรวจสอบTextPaintชั้นเรียน นี่คือวิธีการใช้งาน:

final ClickableSpan clickableSpan = new ClickableSpan() {
    @Override
    public void onClick(final View textView) {
        //Your onClick code here
    }

    @Override
    public void updateDrawState(final TextPaint textPaint) {
        textPaint.setColor(yourContext.getResources().getColor(R.color.orange));
        textPaint.setUnderlineText(true);
    }
};

getColor (int id) เลิกใช้แล้วใน Android 6.0 Marshmallow (API 23) stackoverflow.com/questions/31590714/…
Eka putra

คำตอบที่ดีกับผู้ฟังการคลิก
Muhaiminur Rahman

20

ตั้งค่าช่วงTextViewข้อความของคุณและกำหนดForegroundColorSpanสำหรับข้อความของคุณ

TextView textView = (TextView)findViewById(R.id.mytextview01);    
Spannable wordtoSpan = new SpannableString("I know just how to whisper, And I know just how to cry,I know just where to find the answers");          
wordtoSpan.setSpan(new ForegroundColorSpan(Color.BLUE), 15, 30, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);    
textView.setText(wordtoSpan);

ขอบคุณ! เป็นไปได้ไหมที่จะทำสิ่งนี้โดยไม่กำหนดข้อความให้กับ TextView ก่อน
hpique

ฉันอธิบายตัวเองไม่ดี ให้ฉันใช้ถ้อยคำใหม่ 3 บรรทัดแรกจำเป็นหรือไม่ คุณไม่สามารถสร้างวัตถุ Spannable จากสตริงได้โดยตรงหรือไม่
hpique

ตอนนี้คุณต้องเก็บข้อความของ TextView ของคุณลงในบัฟเฟอร์ Spannable เพื่อเปลี่ยนสีพื้นหน้า
Jorgesys

ฉันต้องการทำสิ่งเดียวกันด้วยสีบวกฉันต้องการให้ทุกอย่างเป็นตัวหนายกเว้นส่วนที่มีสีส่วนที่ฉันต้องการเป็นตัวเอียงฉันจะทำอย่างไร
Lukap

1
วิธีการตั้งค่าคลิกในช่วง?
Rishabh Srivastava

13

อีกวิธีหนึ่งที่สามารถใช้ได้ในบางสถานการณ์คือการตั้งค่าสีของลิงค์ในคุณสมบัติของมุมมองที่ใช้ Spannable

หาก Spannable ของคุณจะถูกใช้ใน TextView คุณสามารถตั้งค่าสีของลิงค์ใน XML ดังนี้:

<TextView
    android:id="@+id/myTextView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColorLink="@color/your_color"
</TextView>

คุณยังสามารถตั้งค่าในรหัสด้วย:

TextView tv = (TextView) findViewById(R.id.myTextView);
tv.setLinkTextColor(your_color);

5

มีโรงงานสำหรับสร้าง Spannable และหลีกเลี่ยงการร่ายเช่นนี้

Spannable span = Spannable.Factory.getInstance().newSpannable("text");

1
คุณช่วยอธิบายวิธีใช้ SpannableFactory ได้อย่างไร ข้อความ "ควรมีลักษณะอย่างไร
Piotr

หลังจากสร้าง Spannable โดย SpannableFactory แล้วจะใช้ยังไง?
MBH

5

ชุดสีบนข้อความโดยผ่าน Stringและสี :

private String getColoredSpanned(String text, String color) {
  String input = "<font color=" + color + ">" + text + "</font>";
  return input;
}

ตั้งค่าข้อความบนTextView / ปุ่ม / EditText และอื่น ๆ โดยเรียกรหัสด้านล่าง:

TextView:

TextView txtView = (TextView)findViewById(R.id.txtView);

รับสายสี:

String name = getColoredSpanned("Hiren", "#800000");

ตั้งค่าข้อความบน TextView:

txtView.setText(Html.fromHtml(name));

เสร็จสิ้น


4
String text = "I don't like Hasina.";
textView.setText(spannableString(text, 8, 14));

private SpannableString spannableString(String text, int start, int end) {
    SpannableString spannableString = new SpannableString(text);
    ColorStateList redColor = new ColorStateList(new int[][]{new int[]{}}, new int[]{0xffa10901});
    TextAppearanceSpan highlightSpan = new TextAppearanceSpan(null, Typeface.BOLD, -1, redColor, null);

    spannableString.setSpan(highlightSpan, start, end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
    spannableString.setSpan(new BackgroundColorSpan(0xFFFCFF48), start, end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
    spannableString.setSpan(new RelativeSizeSpan(1.5f), start, end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

    return spannableString;
}

เอาท์พุท:

ป้อนคำอธิบายรูปภาพที่นี่


คุณไม่ชอบ Hasina 🤣
Abu Nayem

3

เพียงเพิ่มคำตอบที่ได้รับการยอมรับเนื่องจากคำตอบทั้งหมดดูเหมือนจะพูดคุยandroid.graphics.Colorเท่านั้น: จะเกิดอะไรขึ้นถ้าสีที่ฉันต้องการถูกกำหนดไว้res/values/colors.xml?

ตัวอย่างเช่นพิจารณาสีการออกแบบวัสดุที่กำหนดไว้ในcolors.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="md_blue_500">#2196F3</color>
</resources>

( android_material_design_colours.xmlเป็นเพื่อนที่ดีที่สุดของคุณ)

จากนั้นใช้ContextCompat.getColor(getContext(), R.color.md_blue_500)สถานที่ที่คุณจะใช้Color.BLUEเพื่อที่:

wordtoSpan.setSpan(new ForegroundColorSpan(Color.BLUE), 15, 30, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

กลายเป็น:

wordtoSpan.setSpan(new ForegroundColorSpan(ContextCompat.getColor(getContext(), R.color.md_blue_500)), 15, 30, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

ที่ฉันพบว่า:


2

นี่คือฟังก์ชั่นเสริมของ Kotlin สำหรับสิ่งนี้

    fun TextView.setColouredSpan(word: String, color: Int) {
        val spannableString = SpannableString(text)
        val start = text.indexOf(word)
        val end = text.indexOf(word) + word.length
        try {
            spannableString.setSpan(ForegroundColorSpan(color), start, end,Spannable.SPAN_EXCLUSIVE_EXCLUSIVE)
            text = spannableString
        } catch (e: IndexOutOfBoundsException) {
         println("'$word' was not not found in TextView text")
    }
}

ใช้มันหลังจากที่คุณตั้งค่าข้อความของคุณเป็น TextView อย่างนั้น

private val blueberry by lazy { getColor(R.color.blueberry) }

textViewTip.setColouredSpan("Warning", blueberry)

0
  1. สร้างมุมมองข้อความในเค้าโครงของคุณ
  2. วางรหัสนี้ใน MainActivity ของคุณ

    TextView textview=(TextView)findViewById(R.id.textviewid);
    Spannable spannable=new SpannableString("Hello my name is sunil");
    spannable.setSpan(new ForegroundColorSpan(Color.BLUE), 0, 5, 
    Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
    textview.setText(spannable);
    //Note:- the 0,5 is the size of colour which u want to give the strring
    //0,5 means it give colour to starting from h and ending with space i.e.(hello), if you want to change size and colour u can easily

0

ด้านล่างใช้ได้อย่างสมบูรณ์แบบสำหรับฉัน

    tvPrivacyPolicy = (TextView) findViewById(R.id.tvPrivacyPolicy);
    String originalText = (String)tvPrivacyPolicy.getText();
    int startPosition = 15;
    int endPosition = 31;

    SpannableString spannableStr = new SpannableString(originalText);
    UnderlineSpan underlineSpan = new UnderlineSpan();
    spannableStr.setSpan(underlineSpan, startPosition, endPosition, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);

    ForegroundColorSpan backgroundColorSpan = new ForegroundColorSpan(Color.BLUE);
    spannableStr.setSpan(backgroundColorSpan, startPosition, endPosition, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);

    StyleSpan styleSpanItalic  = new StyleSpan(Typeface.BOLD);

    spannableStr.setSpan(styleSpanItalic, startPosition, endPosition, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);

    tvPrivacyPolicy.setText(spannableStr);

เอาท์พุทสำหรับรหัสข้างต้น

ป้อนคำอธิบายรูปภาพที่นี่


0

บางคำตอบที่นี่ยังไม่ทันสมัย เพราะคุณจะได้ (ในส่วนของกรณี) เพิ่มการกระทำที่กำหนดเองคลิกที่ลิงค์ของคุณ

นอกเหนือจากที่ระบุไว้ในเอกสารคู่มือสีของสตริงที่ถูกขยายของคุณจะมีสีเริ่มต้น "สีของลิงก์เริ่มต้นคือสีหรือสำเนียงของธีม: textColorLink ถ้ามีการกำหนดแอตทริบิวต์นี้ในธีม"

นี่คือวิธีที่จะทำอย่างปลอดภัย

 private class CustomClickableSpan extends ClickableSpan {

    private int color = -1;

    public CustomClickableSpan(){
        super();
        if(getContext() != null) {
            color = ContextCompat.getColor(getContext(), R.color.colorPrimaryDark);
        }
    }

    @Override
    public void updateDrawState(@NonNull TextPaint ds) {
        ds.setColor(color != -1 ? color : ds.linkColor);
        ds.setUnderlineText(true);
    }

    @Override
    public void onClick(@NonNull View widget) {
    }
}

จากนั้นให้ใช้มัน

   String text = "my text with action";
    hideText= new SpannableString(text);
    hideText.setSpan(new CustomClickableSpan(){

        @Override
        public void onClick(@NonNull View widget) {
            // your action here !
        }

    }, 0, text.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    yourtextview.setText(hideText);
    // don't forget this ! or this will not work !
    yourtextview.setMovementMethod(LinkMovementMethod.getInstance());

หวังว่านี่จะช่วยได้มาก!


0

จาก docs นักพัฒนาเพื่อเปลี่ยนสีและขนาดของ spannable:

1- สร้างคลาส:

    class RelativeSizeColorSpan(size: Float,@ColorInt private val color: Int): RelativeSizeSpan(size) {

    override fun updateDrawState(textPaint: TextPaint?) {
        super.updateDrawState(textPaint)
        textPaint?.color = color
    } 
}

2 สร้าง spannable โดยใช้คลาสนั้น:

    val spannable = SpannableStringBuilder(titleNames)
spannable.setSpan(
    RelativeSizeColorSpan(1.5f, Color.CYAN), // Increase size by 50%
    titleNames.length - microbe.name.length, // start
    titleNames.length, // end
    Spannable.SPAN_EXCLUSIVE_INCLUSIVE
)
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.