Skip to content

Commit

Permalink
Merge pull request #120 from Trendyol/feature/toolbar-view-binding
Browse files Browse the repository at this point in the history
Add ViewBinding to Toolbar
  • Loading branch information
bilgehankalkan authored Nov 9, 2023
2 parents 33603f3 + 74156a7 commit a815c23
Show file tree
Hide file tree
Showing 6 changed files with 302 additions and 148 deletions.
Binary file modified images/toolbar-1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions libraries/toolbar/README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<img src="https://raw.githubusercontent.com/Trendyol/android-ui-components/master/images/toolbar-1.png" width="240"/>

$toolbarVersion = toolbar-2.0.9 [![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0)
$toolbarVersion = toolbar-2.1.0 [![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0)

## Toolbar
Toolbar is alternative implementation of Toolbar component on Android.
Expand Down Expand Up @@ -94,7 +94,7 @@ Sample usage with `ToolbarViewState`:
This library is maintained mainly by Trendyol Android Team members. Everybody can contribute **Toolbar** or other UI Components with opening new PR's.

# License
Copyright 2022 Trendyol.com
Copyright 2023 Trendyol.com

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
Expand Down
1 change: 1 addition & 0 deletions libraries/toolbar/build.gradle.kts
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ android {

consumerProguardFiles("consumer-rules.pro")
}
buildFeatures.viewBinding = true
buildTypes {
getByName<com.android.build.gradle.internal.dsl.BuildType>("release") {
isMinifyEnabled = false
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,18 @@ package com.trendyol.uicomponents.toolbar

import android.content.Context
import android.util.AttributeSet
import android.view.LayoutInflater
import android.view.View
import androidx.appcompat.widget.AppCompatImageView
import androidx.appcompat.widget.AppCompatTextView
import androidx.constraintlayout.widget.ConstraintLayout
import com.trendyol.uicomponents.toolbar.databinding.ViewToolbarBinding

class Toolbar : ConstraintLayout {

var viewState: ToolbarViewState? = ToolbarViewState()
private var binding: ViewToolbarBinding =
ViewToolbarBinding.inflate(LayoutInflater.from(context), this)

var viewState: ToolbarViewState = ToolbarViewState()
set(value) {
if (value == null) return
field = value
applyViewState()
}
Expand All @@ -25,16 +27,6 @@ class Toolbar : ConstraintLayout {
var upperRightTextClickListener: (() -> Unit)? = null
var lowerRightTextClickListener: (() -> Unit)? = null

private val imageBackground: AppCompatImageView by lazy { findViewById<AppCompatImageView>(R.id.imageBackground) }
private val imageLeft: AppCompatImageView by lazy { findViewById<AppCompatImageView>(R.id.imageLeft) }
private val imageRight: AppCompatImageView by lazy { findViewById<AppCompatImageView>(R.id.imageRight) }
private val imageMiddle: AppCompatImageView by lazy { findViewById<AppCompatImageView>(R.id.imageMiddle) }
private val textLeftUp: AppCompatTextView by lazy { findViewById<AppCompatTextView>(R.id.textLeftUp) }
private val textLeftDown: AppCompatTextView by lazy { findViewById<AppCompatTextView>(R.id.textLeftDown) }
private val textRightUp: AppCompatTextView by lazy { findViewById<AppCompatTextView>(R.id.textRightUp) }
private val textRightDown: AppCompatTextView by lazy { findViewById<AppCompatTextView>(R.id.textRightDown) }
private val textMiddle: AppCompatTextView by lazy { findViewById<AppCompatTextView>(R.id.textMiddle) }

constructor(context: Context) : super(context)

constructor(context: Context, attrs: AttributeSet?) : super(context, attrs) {
Expand All @@ -50,16 +42,14 @@ class Toolbar : ConstraintLayout {
}

init {
inflate(context, R.layout.view_toolbar, this)

imageLeft.setOnClickListener { leftImageClickListener?.invoke() }
imageMiddle.setOnClickListener { middleImageClickListener?.invoke() }
imageRight.setDebouncedOnClickListener { rightImageClickListener?.invoke() }
textLeftUp.setOnClickListener { upperLeftTextClickListener?.invoke() }
textLeftDown.setOnClickListener { lowerLeftTextClickListener?.invoke() }
textMiddle.setOnClickListener { middleTextClickListener?.invoke() }
textRightUp.setOnClickListener { upperRightTextClickListener?.invoke() }
textRightDown.setOnClickListener { lowerRightTextClickListener?.invoke() }
binding.imageLeft.setOnClickListener { leftImageClickListener?.invoke() }
binding.imageMiddle.setOnClickListener { middleImageClickListener?.invoke() }
binding.imageRight.setDebouncedOnClickListener { rightImageClickListener?.invoke() }
binding.textLeftUp.setOnClickListener { upperLeftTextClickListener?.invoke() }
binding.textLeftDown.setOnClickListener { lowerLeftTextClickListener?.invoke() }
binding.textMiddle.setOnClickListener { middleTextClickListener?.invoke() }
binding.textRightUp.setOnClickListener { upperRightTextClickListener?.invoke() }
binding.textRightDown.setOnClickListener { lowerRightTextClickListener?.invoke() }
}

private fun readFromAttributes(attrs: AttributeSet?, defStyleAttr: Int = 0) {
Expand All @@ -69,7 +59,8 @@ class Toolbar : ConstraintLayout {
defStyleAttr,
0
)?.apply {
val toolbarBackground = getResourceId(R.styleable.Toolbar_toolbarBackground, android.R.color.white)
val toolbarBackground =
getResourceId(R.styleable.Toolbar_toolbarBackground, android.R.color.white)
val leftImageDrawableResId =
getResourceId(
R.styleable.Toolbar_leftImageDrawable,
Expand All @@ -90,21 +81,35 @@ class Toolbar : ConstraintLayout {
resources.getDimensionPixelOffset(R.dimen.trendyol_uicomponents_toolbar_margin_outer)

val upperLeftTextMarginStart =
getDimensionPixelOffset(R.styleable.Toolbar_upperLeftTextMarginStart, leftTextDefaultMarginStart)
getDimensionPixelOffset(
R.styleable.Toolbar_upperLeftTextMarginStart,
leftTextDefaultMarginStart
)
val lowerLeftTextMarginStart =
getDimensionPixelOffset(R.styleable.Toolbar_lowerLeftTextMarginStart, leftTextDefaultMarginStart)
getDimensionPixelOffset(
R.styleable.Toolbar_lowerLeftTextMarginStart,
leftTextDefaultMarginStart
)

val upperRightTextMarginEnd =
getDimensionPixelOffset(R.styleable.Toolbar_upperRightTextMarginEnd, rightTextDefaultMarginEnd)
getDimensionPixelOffset(
R.styleable.Toolbar_upperRightTextMarginEnd,
rightTextDefaultMarginEnd
)
val lowerRightTextMarginEnd =
getDimensionPixelOffset(R.styleable.Toolbar_lowerRightTextMarginEnd, rightTextDefaultMarginEnd)
getDimensionPixelOffset(
R.styleable.Toolbar_lowerRightTextMarginEnd,
rightTextDefaultMarginEnd
)
val rightImageDrawableMarginEnd =
getDimensionPixelOffset(R.styleable.Toolbar_rightImageDrawableMarginEnd, 0)
val leftImageDrawableMarginStart =
getDimensionPixelOffset(R.styleable.Toolbar_leftImageDrawableMarginStart, 0)
val hideLeftImage = getBoolean(R.styleable.Toolbar_hideLeftImage, false)
val leftImageContentDescription = getString(R.styleable.Toolbar_leftImageContentDescription) ?: ""
val rightImageContentDescription = getString(R.styleable.Toolbar_rightImageContentDescription) ?: ""
val leftImageContentDescription =
getString(R.styleable.Toolbar_leftImageContentDescription) ?: ""
val rightImageContentDescription =
getString(R.styleable.Toolbar_rightImageContentDescription) ?: ""

viewState = ToolbarViewState(
upperLeftText = upperLeftText,
Expand All @@ -130,44 +135,44 @@ class Toolbar : ConstraintLayout {
}

private fun applyViewState() {
with(viewState!!) {
imageBackground.setDrawableResource(toolbarBackground)

imageLeft.setDrawableResource(leftImageDrawableResId)
imageLeft.setStartMargin(leftImageDrawableMarginStartInPixel)
imageLeft.visibility = if (hideLeftImage) View.GONE else View.VISIBLE
imageLeft.contentDescription = leftImageContentDescription

imageMiddle.setDrawableResource(middleImageDrawableResId)

imageRight.setDrawableResource(rightImageDrawableResId)
imageRight.setEndMargin(rightImageDrawableMarginEndInPixel)
imageRight.contentDescription = rightImageContentDescription

textLeftUp.text = upperLeftTextValue
textLeftUp.visibility = upperLeftTextVisibility
textLeftUp.setStyle(upperLeftTextAppearance)
textLeftUp.setStartMargin(upperLeftTextMarginStartInPixel)

textLeftDown.text = lowerLeftTextValue
textLeftDown.visibility = lowerLeftTextVisibility
textLeftDown.setStyle(lowerLeftTextAppearance)
textLeftDown.setStartMargin(lowerLeftTextMarginStartInPixel)

textMiddle.text = middleTextValue
textMiddle.visibility = middleTextVisibility
textMiddle.setStyle(middleTextAppearance)

textRightUp.text = upperRightTextValue
textRightUp.visibility = upperRightTextVisibility
textRightUp.setStyle(upperRightTextAppearance)
textRightUp.setEndMargin(upperRightTextMarginEndInPixel)
textRightUp.isEnabled = isUpperRightTextEnabled

textRightDown.text = lowerRightTextValue
textRightDown.visibility = lowerRightTextVisibility
textRightDown.setStyle(lowerRightTextAppearance)
textRightDown.setEndMargin(lowerRightTextMarginEndInPixel)
with(viewState) {
binding.imageBackground.setDrawableResource(toolbarBackground)

binding.imageLeft.setDrawableResource(leftImageDrawableResId)
binding.imageLeft.setStartMargin(leftImageDrawableMarginStartInPixel)
binding.imageLeft.visibility = if (hideLeftImage) View.GONE else View.VISIBLE
binding.imageLeft.contentDescription = leftImageContentDescription

binding.imageMiddle.setDrawableResource(middleImageDrawableResId)

binding.imageRight.setDrawableResource(rightImageDrawableResId)
binding.imageRight.setEndMargin(rightImageDrawableMarginEndInPixel)
binding.imageRight.contentDescription = rightImageContentDescription

binding.textLeftUp.text = upperLeftTextValue
binding.textLeftUp.visibility = upperLeftTextVisibility
binding.textLeftUp.setStyle(upperLeftTextAppearance)
binding.textLeftUp.setStartMargin(upperLeftTextMarginStartInPixel)

binding.textLeftDown.text = lowerLeftTextValue
binding.textLeftDown.visibility = lowerLeftTextVisibility
binding.textLeftDown.setStyle(lowerLeftTextAppearance)
binding.textLeftDown.setStartMargin(lowerLeftTextMarginStartInPixel)

binding.textMiddle.text = middleTextValue
binding.textMiddle.visibility = middleTextVisibility
binding.textMiddle.setStyle(middleTextAppearance)

binding.textRightUp.text = upperRightTextValue
binding.textRightUp.visibility = upperRightTextVisibility
binding.textRightUp.setStyle(upperRightTextAppearance)
binding.textRightUp.setEndMargin(upperRightTextMarginEndInPixel)
binding.textRightUp.isEnabled = isUpperRightTextEnabled

binding.textRightDown.text = lowerRightTextValue
binding.textRightDown.visibility = lowerRightTextVisibility
binding.textRightDown.setStyle(lowerRightTextAppearance)
binding.textRightDown.setEndMargin(lowerRightTextMarginEndInPixel)
}
}
}
62 changes: 48 additions & 14 deletions sample/src/main/java/com/trendyol/uicomponents/ToolbarActivity.kt
Original file line number Diff line number Diff line change
Expand Up @@ -3,27 +3,61 @@ package com.trendyol.uicomponents
import android.os.Bundle
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
import com.trendyol.uicomponents.toolbar.Toolbar
import com.trendyol.uicomponents.databinding.ActivityToolbarBinding
import com.trendyol.uicomponents.toolbar.ToolbarViewState

class ToolbarActivity : AppCompatActivity() {

private val toolbar3 by lazy { findViewById<Toolbar>(R.id.toolbar3) }
private var _binding: ActivityToolbarBinding? = null
private val binding get() = _binding!!

override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_toolbar)

toolbar3.viewState = ToolbarViewState(
rightImageDrawableResId = android.R.drawable.ic_menu_add,
rightImageContentDescription = "Add",
middleText = getString(android.R.string.unknownName),
upperLeftText = "<h1>HTML text</h1>",
upperLeftTextMarginStartInPixel = 20
)

toolbar3.upperLeftTextClickListener = {
Toast.makeText(this, "toolbar3.upperLeftTextClickListener", Toast.LENGTH_SHORT).show()
_binding = ActivityToolbarBinding.inflate(layoutInflater)
setContentView(binding.root)

setUpToolbar3()
setUpToolbar4()

binding.toolbar.leftImageClickListener = { onBackPressed() }
}

private fun setUpToolbar3() {
with(binding.toolbar3) {
viewState = ToolbarViewState(
rightImageDrawableResId = android.R.drawable.ic_menu_add,
rightImageContentDescription = "Add",
middleText = "<h1>HTML text</h1>",
upperLeftTextMarginStartInPixel = 20
)

lowerLeftTextClickListener = { showToast("toolbar3.lowerLeftTextClickListener") }
upperLeftTextClickListener = { showToast("toolbar3.upperLeftTextClickListener") }
lowerRightTextClickListener = { showToast("toolbar3.lowerRightTextClickListener") }
upperRightTextClickListener = { showToast("toolbar3.upperRightTextClickListener") }
middleTextClickListener = { showToast("toolbar3.middleTextClickListener") }
leftImageClickListener = { showToast("toolbar3.leftImageClickListener") }
rightImageClickListener = { showToast("toolbar3.rightImageClickListener") }
}
}

private fun setUpToolbar4() {
with(binding.toolbar4) {
lowerLeftTextClickListener = { showToast("toolbar4.lowerLeftTextClickListener") }
upperLeftTextClickListener = { showToast("toolbar4.upperLeftTextClickListener") }
lowerRightTextClickListener = { showToast("toolbar4.lowerRightTextClickListener") }
upperRightTextClickListener = { showToast("toolbar4.upperRightTextClickListener") }
leftImageClickListener = { showToast("toolbar4.leftImageClickListener") }
rightImageClickListener = { showToast("toolbar4.rightImageClickListener") }
}
}

private fun showToast(message: String) {
Toast.makeText(this, message, Toast.LENGTH_SHORT).show()
}

override fun onDestroy() {
super.onDestroy()
_binding = null
}
}
Loading

0 comments on commit a815c23

Please sign in to comment.