Showing posts with label Color String. Show all posts
Showing posts with label Color String. Show all posts

Wednesday, October 4, 2017

Tô chữ nhiều màu Swift

Bình thường, để tô màu chữ label ta dùng lệnh
la.textColor = UIColor.blueColor()
Lệnh này làm toàn bộ chữ có màu xanh, nếu ta muốn chữ chỗ xanh chỗ đỏ, ta phải dùng NSMutableAttributedString.
let text="Đâylà chữ ví dụ"
let at =  NSMutableAttributedString(string: text,attributes: [NSFontAttributeName:UIFont.boldSystemFontOfSize(17)])
        at.addAttribute(NSForegroundColorAttributeName, value:UIColor.redColor(), range: NSMakeRange(0,4))
        at.addAttribute(NSForegroundColorAttributeName, value: UIColor.greenColor(), range: NSRange(location:6,length:5))
       la.attributedText = at

Tiếp theo, ta có một chuỗi có nhiều dòng, ta muốn mỗi dòng có một màu. Thông thường ta phải set mỗi dòng vào 1 label rồi tô màu riêng của label đó. Nhưng với lớp NSMutableAttributedString ta có thể làm ngay trong một label.
Giả sử chuỗi của ta có 7 dòng từ Thứ Hai đến Chủ Nhật, ta muốn set mỗi dòng một màu, chỉ trong 1 label duy nhất.
Ta sẽ khai báo một mảng array các thứ
var thu=[String](count: 7, repeatedValue: " ")
        thu[0]="Thứ hai"
        thu[1]="Thứ ba"
        thu[2]="Thứ tư"
        thu[3]="Thứ năm"
        thu[4]="Thứ sáu"
        thu[5]="Thứ bảy"
        thu[6]="Chủ nhật"
Khai báo các màu sẽ dùng
let mau1 = [NSForegroundColorAttributeName: UIColor.blackColor(), NSFontAttributeName: UIFont.systemFontOfSize(17)]
let mau2 = [NSForegroundColorAttributeName: UIColor.brownColor(), NSFontAttributeName: UIFont.systemFontOfSize(17)]
let mau3 = [NSForegroundColorAttributeName: UIColor.redColor(), NSFontAttributeName: UIFont.systemFontOfSize(17)]
let mau4 = [NSForegroundColorAttributeName: UIColor.orangeColor(),NSFontAttributeName: UIFont.systemFontOfSize(17)]
let mau5 = [NSForegroundColorAttributeName: UIColor.grayColor(), NSFontAttributeName: UIFont.systemFontOfSize(17)]
let mau6 = [NSForegroundColorAttributeName: UIColor.blueColor(), NSFontAttributeName: UIFont.systemFontOfSize(17)]
let mau7 = [NSForegroundColorAttributeName: UIColor.cyanColor(), NSFontAttributeName: UIFont.systemFontOfSize(17)]
let at = NSMutableAttributedString()
var p1 = NSMutableAttributedString()
Canh lề trái luôn
let pa = NSMutableParagraphStyle()
        pa.alignment = .Left
Dùng lệnh for duyệt mảng để set màu cho từng dòng.
for i in0..<thu.count{
if thu[i] == "Thứ hai" {
        p1 = NSMutableAttributedString(string: thu[i] + "\n", attributes: mau1)
            }
elseif thu[i] == "Thứ ba" {
        p1 = NSMutableAttributedString(string: thu[i] + "\n", attributes: mau2)
            }
elseif thu[i] == "Thứ tư" {
        p1 = NSMutableAttributedString(string: thu[i] + "\n", attributes: mau3)
                          }
elseif thu[i] == "Thứ năm" {
        p1 = NSMutableAttributedString(string: thu[i] + "\n", attributes: mau4)
                           }
elseif thu[i] == "Thứ sáu"{
       p1 = NSMutableAttributedString(string: thu[i] + "\n", attributes: mau5)
                            }
elseif thu[i] == "Thứ bảy"{
        p1 = NSMutableAttributedString(string: thu[i] + "\n", attributes: mau6)
            }
else {
      p1 = NSMutableAttributedString(string: thu[i] + "\n", attributes: mau7)
            }
 at.appendAttributedString(p1)
at.addAttribute(NSParagraphStyleAttributeName,value:pa, range:NSMakeRange(0,1))
 }
la.numberOfLines = 0
la.attributedText = at
la.sizeToFit()
Bạn chạy thử sẽ thấy kết quả như trên.
Dòng la.numberOfLines = 0 để label có thể set được nhiều dòng, nếu không nó chỉ hiển thị dòng đầu tiên.

Dòng cuối là để label có đủ chiều cao hiển thị được 7 dòng.

Tô màu chữ trong Android

Để tô màu chữ, ta có thể làm trong file xml.
android:textColor="#00F"
Cũng có thể làm trong code.
TextView.setTextColor(Color.parseColor("#800080"));
Tuy nhiên, nếu ta muốn tô màu cùng một đoạn chữ nhưng có các màu khác nhau, ta phải dùng lớp SpannableString.
Giả sử ta muốn từng đoạn trong một chuỗi có màu khác nhau, ta làm như sau.
String vao="Đây là dòng chữ có nhiều màu";
SpannableString s = new SpannableString(vao);
s.setSpan(new ForegroundColorSpan(Color.RED), 0, 8, 0);
s.setSpan(new ForegroundColorSpan(Color.parseColor("#008000")), 8, 15, 0);
s.setSpan(new ForegroundColorSpan(Color.parseColor("#0000ff")), 16, 27, 0);
tv.setText(s);

Các ký tự sẽ tùy theo vị trí ta đã đặt.
Tiếp theo, ta có một chuỗi có nhiều dòng, ta muốn mỗi dòng có một màu. Thông thường ta phải set mỗi dòng vào 1 textView rồi tô màu riêng của textView đó. Nhưng với lớp SpannableStringBuilder ta có thể làm ngay trong một textView.
Giả sử chuỗi của ta có 7 dòng từ Thứ Hai đến Chủ Nhật, ta muốn set mỗi dòng một màu, chỉ trong 1 textView duy nhất.
Ta sẽ hai báo một mảng arraylist.
ArrayList<String> ar = new ArrayList<String>();
Thêm các thứ vào mảng.

Dùng lệnh for duyệt mảng để set màu cho từng dòng.
SpannableString s1 = new SpannableString("\n");
          SpannableStringBuilder builder = new SpannableStringBuilder();
for (int i = 0; i < ar.size(); i++) {
     if (ar.get(i).equals("Thứ Hai")) {
SpannableString redSpannable = new SpannableString(ar.get(i));
                   redSpannable.setSpan(new ForegroundColorSpan(Color.parseColor("#FF7F50")), 0, ar
                             .get(i).length(), 0);
              builder.append(redSpannable);
              builder.append(s1);              
} else if (ar.get(i).equals("Thứ Ba")) {
SpannableString redSpannable = new SpannableString(ar.get(i));
                   redSpannable.setSpan(new ForegroundColorSpan(Color.parseColor("#0000ff")),
                             0, ar.get(i).length(), 0);
                   builder.append(redSpannable);
                   builder.append(s1);
} else if (ar.get(i).equals("Thứ Tư")) {
SpannableString redSpannable = new SpannableString(ar.get(i));
                   redSpannable.setSpan(new ForegroundColorSpan(Color.parseColor("#ff008000")),
                             0, ar.get(i).length(), 0);
                   builder.append(redSpannable);
                   builder.append(s1);
} else if (ar.get(i).equals("Thứ Năm")) {SpannableString redSpannable = new SpannableString(ar.get(i));
                   redSpannable.setSpan(new ForegroundColorSpan(Color.parseColor("#800000")),
                             0, ar.get(i).length(), 0);
          builder.append(redSpannable);
          builder.append(s1);
     } else if (ar.get(i).equals("Thứ Sáu")) {
                   SpannableString redSpannable = new SpannableString(ar.get(i));
redSpannable.setSpan(new ForegroundColorSpan(Color.parseColor("#00FF00")),
                             0, ar.get(i).length(), 0);
     builder.append(redSpannable);
     builder.append(s1);
     }
     else if (ar.get(i).equals("Thứ Bảy")) {
SpannableString redSpannable = new SpannableString(ar.get(i));
     redSpannable.setSpan(new ForegroundColorSpan(Color.parseColor("#FF00FF")),
                             0, ar.get(i).length(), 0);
          builder.append(redSpannable);
          builder.append(s1);
     }
else {
SpannableString redSpannable = new SpannableString(ar.get(i));
                   redSpannable.setSpan(new ForegroundColorSpan(Color.RED), 0, ar
                             .get(i).length(), 0);
     builder.append(redSpannable);
     builder.append(s1);
}
}
     builder.delete(builder.length() - 1, builder.length());
     tv2.setText(builder);
Kết quả chạy ra như sau.