Order and Un Order List in Android Textview Kotlin
Published January 22, 2021Display items in list is most common scenario in any application. This list can be an Order List or Un Order List. How we will achieve this order or un order list in Android TextView. This post we will cover how to achieve order/un order list with TextView. Bullet List Let say if we want to display list with bullet points. Android provided one simple class called Spannable class where we can revamp the text in different styles. Create Bullet List with SpannableStringBuilder and BulletSpan() Suppose we have te List with data like val items =arrayOf (" Un Order List Item 1", " Un Order List Item 2", " Un Order List Item 3") To Make the Bullet List data we use below code Now let's append this SpannableStringBuilder object to TextView. This will return output like below In case you’d like to set the offset area manually or set the color of the bullet point, simply use the optional Number List To display number list is same like bullet list, but we approach different way to make this number list, why because Android doesn't have any specific Spannable to make this list type. So Let's create a Custom class which will extends LeadingMarginSpan and Override two methods to handle the logic } To display the number infront of the each line we need to write below code Then again follow the above process to set the text for the TextView Complete TextView Order List Example Activity.kt
val items =arrayOf (" Un Order List Item 1", " Un Order List Item 2", " Un Order List Item 3")
var builder = SpannableStringBuilder()
items.forEach { item ->
builder.append(
item + "\n\n", // Add some linebreaks
BulletSpan(), // Add the bullet point span
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)
}
BulletSpan implements LeadingMarginSpan, which basically offsets your text. gapWidth and color parameters of BulletSpan
override fun drawLeadingMargin(
canvas: Canvas,
paint: Paint,
x: Int,
dir: Int,
top: Int,
baseline: Int,
bottom: Int,
text: CharSequence,
start: Int,
end: Int,
first: Boolean,
layout: Layout
) {
override fun getLeadingMargin(first: Boolean): Int = width
val spanStart = (text as Spanned).getSpanStart(this)
val isFirstCharacter = spanStart == start
// If so, draw the text in the leading span
if (isFirstCharacter) {
canvas.drawText(leadingText, x.toFloat(), baseline.toFloat(), paint)
}
val txt_order=findViewById<TextView>(R.id.txt_order);
txt_unorder.setText(builder)
builder = SpannableStringBuilder()
items.forEachIndexed { index, item ->
builder.append(
item + "\n\n",
OrderedListSpan(30, "$index."),
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)
}
txt_order.setText(builder)
package com.rrtutors.inappreview
import android.graphics.Canvas
import android.graphics.Paint
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.text.Layout
import android.text.Spannable
import android.text.SpannableStringBuilder
import android.text.Spanned
import android.text.style.BulletSpan
import android.text.style.LeadingMarginSpan
import android.widget.TextView
class OrderListAndroid : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_order_list_android)
val items =arrayOf (" Un Order List Item 1", " Un Order List Item 2", " Un Order List Item 3")
var builder = SpannableStringBuilder()
items.forEach { item ->
builder.append(
item + "\n\n", // Add some linebreaks
BulletSpan(), // Add the bullet point span
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)
}
val txt_unorder=findViewById<TextView>(R.id.txt_unorder);
val txt_order=findViewById<TextView>(R.id.txt_order);
txt_unorder.setText(builder)
builder = SpannableStringBuilder()
items.forEachIndexed { index, item ->
builder.append(
item + "\n\n",
OrderedListSpan(30, "$index."),
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)
}
txt_order.setText(builder)
}
}
OrderedListSpan.kt
package com.rrtutors.inappreview
import android.graphics.Canvas
import android.graphics.Paint
import android.text.Layout
import android.text.Spanned
import android.text.style.LeadingMarginSpan
class OrderedListSpan(
private val width: Int,
private val leadingText: String
) : LeadingMarginSpan {
override fun drawLeadingMargin(
canvas: Canvas,
paint: Paint,
x: Int,
dir: Int,
top: Int,
baseline: Int,
bottom: Int,
text: CharSequence,
start: Int,
end: Int,
first: Boolean,
layout: Layout
) {
// Check if we're at the start of the span
val spanStart = (text as Spanned).getSpanStart(this)
val isFirstCharacter = spanStart == start
// If so, draw the text in the leading span
if (isFirstCharacter) {
canvas.drawText(leadingText, x.toFloat(), baseline.toFloat(), paint)
}
}
override fun getLeadingMargin(first: Boolean): Int = width
}
|
Article Contributed By :
|
|
|
|
|
873 Views |
|