Skip to content

3. Attributes

Muhammet Ali YUCE edited this page Oct 20, 2020 · 2 revisions

What is?

StyleR works with provided attributes which handled by library or module which implements the StyleR. For example StyleR provides some of view attributes like background color. To create and set a background drawable to a view use "backgroundColor" and other attributes. If you want to use it for card view implement your own code for it.

Included Attributes

StyleR comes with many useful attributes. But holding dependency to any library we didn’t added them but we’ll show you to implement your view binders too.

  • Any View:

"style": Style name which provides by styles.json
"backgroundColor": View background color from colors.json
"pressedBackgroundColor": View pressed background color from colors.json
"disabledBackgroundColor": View disabled background color from colors.json
"backgroundRadius": View background corner radius in dp
"backgroundBorderWidth": View border width in dp
"elevation": View elevation in dp
"padding": View padding in dp
"paddingTop": View top padding in dp
"paddingBottom": View bottom padding in dp
"paddingStart": View start/left padding in dp
"paddingEnd": View end/right padding in dp
"margin": View margin in dp
"marginTop": View top margin in dp
"marginBottom": View bottom margin in dp
"marginStart": View start/left margin in dp
"marginEnd": View end/right margin in dp
  • Any View extends Text View (Thus can be use for buttons too):

"style": Style name which provides by styles.json
"textSize": Text size in sp
"fontName": Font name which is under assets folder
"textColor": Text color from colors.json
"disabledTextColor": Disabled text color from colors.json
"pressedTextColor": Pressed text color from colors.json
"textAllCaps": Is all caps text enabled -> true/false
  • Button:

"style": Style name which provides by styles.json
and all attributes of TextView & View

Implement Your Attributes

StyleR has scoped function to call for expanding itself by developer. If you pass the viewSetter function when initializing the StyleR you can add your view binders to project.

class AppStyleR {

    fun initialize(resources: Resources) {
        val type = object : TypeToken<HashMap<String, List<HashMap<String, String>>>>() {}.type
        val typeBasic = object : TypeToken<HashMap<String, String>>() {}.type
        val typeStyle = object : TypeToken<HashMap<String, HashMap<String, String>>>() {}.type
        StyleRProvider.initialize(
            Gson().fromJson(resources.getRawTextFile(R.raw.styler), type),
            Gson().fromJson(resources.getRawTextFile(R.raw.colors), typeBasic),
            Gson().fromJson(resources.getRawTextFile(R.raw.styles), typeStyle)
        ) { view: View, hashMap: HashMap<String, String> ->
            (view as? CardView)?.setStyleR(hashMap)
        }
    }
}
This line calls from the Application class. When card views is processing your CardView.setStyleR() function will be invoked by this. Here is the example CardViewBinder extension
class CardViewBinder {
    companion object {
        const val ATTR_STYLE = "style"
        const val ATTR_CARD_BACKGROUND_COLOR = "cardBackgroundColor"
        const val ATTR_CARD_ELEVATION = "cardElevation"

        fun CardView.setStyleR(map: HashMap<String, String>) {
            StyleRProvider.getColor(map[ATTR_CARD_BACKGROUND_COLOR])?.let {
                setCardBackgroundColor(Color.parseColor(it))
            }
            map[ATTR_CARD_ELEVATION]?.toFloatOrNull()?.let {
                cardElevation = it
            }
        }
    }
}

You can add more view binders as shown in the sample app.

Clone this wiki locally