From 995d17abf4bf9f9b007280a83a071bf5e379a621 Mon Sep 17 00:00:00 2001 From: grablack Date: Thu, 19 Oct 2023 15:09:06 -0400 Subject: [PATCH 01/22] intrinsic height issue --- .../paypal/messagesdemo/JetpackActivity.kt | 110 +++++++++++++----- .../main/res/layout/paypal_message_view.xml | 19 +-- 2 files changed, 86 insertions(+), 43 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 53cfe343..4ac69da3 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -1,63 +1,117 @@ package com.paypal.messagesdemo import android.os.Bundle +import android.util.Log import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.foundation.Image -import androidx.compose.foundation.layout.Box -import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.fillMaxSize -import androidx.compose.foundation.layout.height -import androidx.compose.material3.MaterialTheme -import androidx.compose.material3.Surface -import androidx.compose.runtime.getValue -import androidx.compose.runtime.mutableStateOf -import androidx.compose.runtime.remember -import androidx.compose.runtime.setValue +import androidx.compose.foundation.layout.* +import androidx.compose.runtime.* import androidx.compose.ui.Modifier import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.painterResource import androidx.compose.ui.unit.dp +import androidx.compose.ui.viewinterop.AndroidView import com.paypal.messages.Logo import com.paypal.messages.LogoAsset import com.paypal.messages.PayPalMessageView +import com.paypal.messages.config.PayPalEnvironment import com.paypal.messages.config.ProductGroup +import com.paypal.messages.config.message.PayPalMessageConfig +import com.paypal.messages.config.message.PayPalMessageData import com.paypal.messages.config.message.style.PayPalMessageColor import com.paypal.messages.config.message.style.PayPalMessageLogoType import com.paypal.messagesdemo.ui.BasicTheme +import android.view.ViewGroup +import androidx.compose.material3.* +import androidx.compose.runtime.Composable +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.runtime.getValue +import androidx.compose.ui.platform.ComposeView +import androidx.compose.ui.platform.ViewCompositionStrategy +import androidx.compose.ui.unit.dp +import androidx.compose.ui.viewinterop.AndroidView +import androidx.fragment.app.Fragment +import com.paypal.messages.config.message.PayPalMessageViewState + class JetpackActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { - var color by remember { mutableStateOf(PayPalMessageColor.BLACK) } - var logoType by remember { mutableStateOf(PayPalMessageLogoType.PRIMARY) } - var productGroup by remember { mutableStateOf(ProductGroup.PAY_LATER) } - - val asset = Logo(logoType, productGroup).getAsset(color) as LogoAsset.ImageAsset BasicTheme { val context = LocalContext.current // A surface container using the 'background' color from the theme Surface(modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background) { Column { - Dropdown("Color", color, PayPalMessageColor.values()) { color = it } - Dropdown("Logo", logoType, PayPalMessageLogoType.values()) { logoType = it } - Dropdown("Product", productGroup, ProductGroup.values()) { productGroup = it } - - Box(modifier = Modifier.height(50.dp)) { - Image(painter = painterResource(asset.resId), contentDescription = null) - } - - // TODO use AndroidView - // https://developer.android.com/jetpack/compose/migrate/interoperability-apis/views-in-compose - Box { - PayPalMessageView(context) - } + + FilledButtonExample(text = "first", onClick = { println("hello") }) + + AndroidView( + factory = { ctx -> + val messageView = PayPalMessageView(context, + config = PayPalMessageConfig( + data = PayPalMessageData(clientId = "B_Aksh3K8UpGwAs_Ngi0ahNHJja2bsxqtuqmhRAm944xzM-p6Qkq9JbqFc2yTz2Fg5WYtcW1QEu_tHDVuI", environment = PayPalEnvironment.SANDBOX) + ) + ) + messageView + } + ) + FilledButtonExample(text = "second", onClick = { println("hello") }) + + FilledButtonExample(text = "third", onClick = { println("hello") }) + } } } } } } + +@Composable +fun PayPalMessagingView(clientId: String) { + Column( + modifier = Modifier.padding(16.dp).fillMaxWidth() + ) { + Box( + modifier = Modifier.fillMaxWidth() + ) { + if (clientId.isNotEmpty()) { + val config = PayPalMessageConfig() + config.data = PayPalMessageData(clientId = clientId) + + AndroidView( + factory = { context -> + val messageView = PayPalMessageView(context, config = config) + messageView.setViewStates( + PayPalMessageViewState( + onLoading = { + Log.d("TAG", "onLoading") + }, + onError = { + Log.d("TAG", "onError") + }, + onSuccess = { + Log.d("TAG", "onSuccess") + } + ) + ) + messageView + + } + ) + } + } + } +} + + +@Composable +fun FilledButtonExample(onClick: () -> Unit, text: String) { + Button(onClick = { onClick() }) { + Text(text) + } +} + diff --git a/library/src/main/res/layout/paypal_message_view.xml b/library/src/main/res/layout/paypal_message_view.xml index a69f939e..4fdb193c 100644 --- a/library/src/main/res/layout/paypal_message_view.xml +++ b/library/src/main/res/layout/paypal_message_view.xml @@ -1,17 +1,6 @@ - - - - + android:layout_height="wrap_content" + android:text="Message" /> From 66d71ed8354a471cbce77d5414d8148aed7887dd Mon Sep 17 00:00:00 2001 From: grablack Date: Fri, 27 Oct 2023 14:26:41 -0400 Subject: [PATCH 02/22] everything except offer type --- .../paypal/messagesdemo/JetpackActivity.kt | 498 +++++++++++++++++- 1 file changed, 474 insertions(+), 24 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 4ac69da3..08f3bbeb 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -2,66 +2,245 @@ package com.paypal.messagesdemo import android.os.Bundle import android.util.Log +import android.view.View import androidx.activity.ComponentActivity import androidx.activity.compose.setContent -import androidx.compose.foundation.Image import androidx.compose.foundation.layout.* import androidx.compose.runtime.* import androidx.compose.ui.Modifier import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.painterResource -import androidx.compose.ui.unit.dp import androidx.compose.ui.viewinterop.AndroidView import com.paypal.messages.Logo import com.paypal.messages.LogoAsset import com.paypal.messages.PayPalMessageView import com.paypal.messages.config.PayPalEnvironment import com.paypal.messages.config.ProductGroup -import com.paypal.messages.config.message.PayPalMessageConfig -import com.paypal.messages.config.message.PayPalMessageData import com.paypal.messages.config.message.style.PayPalMessageColor import com.paypal.messages.config.message.style.PayPalMessageLogoType import com.paypal.messagesdemo.ui.BasicTheme import android.view.ViewGroup +import android.widget.RadioGroup +import android.widget.ScrollView +import android.widget.Toast +import android.widget.ToggleButton +import androidx.compose.foundation.* import androidx.compose.material3.* import androidx.compose.runtime.Composable import androidx.compose.ui.tooling.preview.Preview import androidx.compose.runtime.getValue import androidx.compose.ui.platform.ComposeView import androidx.compose.ui.platform.ViewCompositionStrategy -import androidx.compose.ui.unit.dp +import androidx.compose.ui.text.input.TextFieldValue import androidx.compose.ui.viewinterop.AndroidView import androidx.fragment.app.Fragment -import com.paypal.messages.config.message.PayPalMessageViewState +import androidx.compose.foundation.layout.Column + +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.width +import androidx.compose.foundation.layout.wrapContentWidth +import androidx.compose.foundation.lazy.LazyColumn +import androidx.compose.foundation.selection.selectable +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.foundation.text.BasicTextField + +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue +import androidx.compose.ui.Alignment +import androidx.compose.ui.graphics.Brush +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.graphicsLayer +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.state.ToggleableState +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.text.font.FontFamily +import androidx.compose.ui.unit.* +import androidx.lifecycle.ViewModel +//import androidx.lifecycle.viewmodel.compose.viewModel +import androidx.compose.material3.ButtonElevation +import com.paypal.messages.config.PayPalMessageOfferType +import com.paypal.messages.config.message.* +import com.paypal.messages.config.message.style.PayPalMessageAlign +import com.paypal.messages.io.Api +import kotlinx.coroutines.Delay +import java.util.logging.Handler class JetpackActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { - BasicTheme { val context = LocalContext.current + + val messageView = PayPalMessageView(context, + config = PayPalMessageConfig( + data = PayPalMessageData(clientID = "B_Aksh3K8UpGwAs_Ngi0ahNHJja2bsxqtuqmhRAm944xzM-p6Qkq9JbqFc2yTz2Fg5WYtcW1QEu_tHDVuI", environment = PayPalEnvironment.SANDBOX), + viewStateCallbacks = PayPalMessageViewStateCallbacks( + onLoading = { +// progressBar.visibility = View.VISIBLE +// resetButton.isEnabled = false +// submitButton.isEnabled = false + Toast.makeText(this, "Loading Content...", Toast.LENGTH_SHORT).show() + }, + onError = { +// Log.d(TAG, "onError") +// progressBar.visibility = View.INVISIBLE + runOnUiThread { +// resetButton.isEnabled = true +// submitButton.isEnabled = true + Toast.makeText(this, it.javaClass.toString() + ":" + it.message, Toast.LENGTH_LONG).show() + } +// it.message?.let { it1 -> Log.d("XmlActivity Error", it1) } +// it.paypalDebugId?.let { it1 -> Log.d("XmlActivity Error", it1) } + }, + onSuccess = { +// Log.d(TAG, "onSuccess") +// progressBar.visibility = View.INVISIBLE + runOnUiThread { +// resetButton.isEnabled = true +// submitButton.isEnabled = true + Toast.makeText(this, "Success Getting Content", Toast.LENGTH_SHORT).show() + } + }, + ) + ) + ) + // A surface container using the 'background' color from the theme Surface(modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background) { - Column { + Column ( + modifier = Modifier.verticalScroll(state = rememberScrollState()) + ){ + + Row { + Text (text = "Message Configuration") + } + + // Client ID + // TODO Change back to Row, Make Input look better + Column ( + modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) + ) { + Text( text = "Client Id", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + var text by remember { mutableStateOf(TextFieldValue( messageView.clientId)) } + +// BasicTextField( +// value = text, +// onValueChange = { +// text = it +// }, +// textStyle = TextStyle(fontSize = 16.sp, color = Color.Black), +// modifier = Modifier +// .fillMaxWidth() // To make the TextField occupy the full width +// .padding(4.dp) // Customize the padding here +//// .background(Color(239f, 239f, 239f)) +// ) + TextField( + value = text, + onValueChange = { + text = it + messageView.clientId = it.text.toString() + }, + placeholder = { Text(text = "Client Id") }, + modifier = Modifier + .height(Dp(value = 64F)) + .padding(all = 1.dp) + ) + + } + + Text("Style Options") + + LogoOptions(messageView) + ColorOptions(messageView) + AlignmentOptions(messageView) + + Row { + Text (text = "Offer Type") + } + + // Amount + Row ( + modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) + ) { + Text(text = "Amount", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + var text by remember { mutableStateOf(TextFieldValue("")) } + + TextField( + value = text, + onValueChange = { + text = it + messageView.amount = it.text.toDouble() + }, + placeholder = { Text(text = "0.00") }, + modifier = Modifier + .height(Dp(value = 64F)) + .padding(all = 1.dp) + ) + + } + + // Buyer Country + Row ( + modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) + ) { + Text(text = "Buyer Country", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + var text by remember { mutableStateOf(TextFieldValue("")) } + + TextField( + value = text, + onValueChange = { + text = it + messageView.buyerCountry = it.text.toString() + }, + placeholder = { Text(text = "US") }, + modifier = Modifier + .height(Dp(value = 64F)) + .padding(all = 1.dp) + ) - FilledButtonExample(text = "first", onClick = { println("hello") }) + } + + // Stage Tag + Row ( + modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) + ) { + Text(text = "Stage Tag", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + var text by remember { mutableStateOf(TextFieldValue("")) } + + TextField( + value = text, + onValueChange = { + text = it + Api.stageTag = it.text.toString() + }, + modifier = Modifier + .height(Dp(value = 64F)) + .padding(all = 1.dp) + ) + + } AndroidView( - factory = { ctx -> - val messageView = PayPalMessageView(context, - config = PayPalMessageConfig( - data = PayPalMessageData(clientId = "B_Aksh3K8UpGwAs_Ngi0ahNHJja2bsxqtuqmhRAm944xzM-p6Qkq9JbqFc2yTz2Fg5WYtcW1QEu_tHDVuI", environment = PayPalEnvironment.SANDBOX) - ) - ) + modifier = Modifier.fillMaxWidth(), + factory = { _ -> messageView } ) - FilledButtonExample(text = "second", onClick = { println("hello") }) - FilledButtonExample(text = "third", onClick = { println("hello") }) + IgnoreCacheSwitch() + DevTouchpointSwitch() + + FilledButtonExample(text = "Reset", onClick = { resetButton(messageView) }) + FilledButtonExample(text = "Submit", onClick = { updateMessageData(messageView) }) + } } @@ -79,14 +258,14 @@ fun PayPalMessagingView(clientId: String) { modifier = Modifier.fillMaxWidth() ) { if (clientId.isNotEmpty()) { - val config = PayPalMessageConfig() - config.data = PayPalMessageData(clientId = clientId) + val config = PayPalMessageConfig( + data = PayPalMessageData(clientID = clientId) + ) AndroidView( factory = { context -> val messageView = PayPalMessageView(context, config = config) - messageView.setViewStates( - PayPalMessageViewState( + messageView.viewStateCallbacks = PayPalMessageViewStateCallbacks( onLoading = { Log.d("TAG", "onLoading") }, @@ -97,7 +276,7 @@ fun PayPalMessagingView(clientId: String) { Log.d("TAG", "onSuccess") } ) - ) + messageView } @@ -107,11 +286,282 @@ fun PayPalMessagingView(clientId: String) { } } - @Composable fun FilledButtonExample(onClick: () -> Unit, text: String) { - Button(onClick = { onClick() }) { + var isButtonClicked by remember { mutableStateOf(false) } + Button( +// elevation = Dp(1F), + onClick = { + onClick() + isButtonClicked = !isButtonClicked + }, +// modifier = Modifier +// .graphicsLayer( +// scaleX = if (isButtonClicked) 1.2f else 1f, +// scaleY = if (isButtonClicked) 1.2f else 1f +// ) + ) { Text(text) } } +@Composable +fun OutlinedButtonExample(onClick: () -> Unit) { +// var elevation: ButtonElevation = ButtonElevation() + OutlinedButton( +// elevation = elevation, + onClick = { onClick() }, + ) { + Text("Outlined") + } +} + +@Composable +fun LogoOptions(messageView: PayPalMessageView) { + var selected by remember { mutableStateOf("Primary") } + val radioGroupOptions = listOf("Primary", "Inline", "Alternative", "None") + val onSelectedChange = { text: String -> + selected = text + messageView.logoType = when ( text.toString() ) { + "Primary" -> PayPalMessageLogoType.PRIMARY + "Inline" -> PayPalMessageLogoType.INLINE + "Alternative" -> PayPalMessageLogoType.ALTERNATIVE + "None" -> PayPalMessageLogoType.NONE + else -> PayPalMessageLogoType.PRIMARY + } + } + + Row ( + horizontalArrangement = Arrangement.SpaceEvenly + ) { + radioGroupOptions.forEach { text -> + + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelectedChange(text) } + ), + ) { + RadioButton ( + selected = (text == selected), + onClick = { onSelectedChange(text) }, + modifier = Modifier + .padding(end = Dp(0F)) +// .background(color = Color.Black) + .size(Dp(24f)) + ) + Text( + text = text, + fontSize = 16.sp, +// color = Color.White, + modifier = Modifier +// .background(color = Color.Black) + .align(Alignment.CenterVertically), + + ) + } + + + } + } +} + +@Composable +fun ColorOptions(messageView: PayPalMessageView) { + var selected by remember { mutableStateOf("Black") } + + val radioGroupOptions = listOf("Black", "White", "Monochorme", "Grayscale") + val onSelectedChange = { text: String -> + selected = text + messageView.color = when ( text.toString() ) { + "Black" -> PayPalMessageColor.BLACK + "White" -> PayPalMessageColor.WHITE + "Monochorme" -> PayPalMessageColor.MONOCHROME + "Grayscale" -> PayPalMessageColor.GRAYSCALE + else -> PayPalMessageColor.BLACK + } + } + + Row ( + horizontalArrangement = Arrangement.SpaceEvenly + ) { + radioGroupOptions.forEach { text -> + + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelectedChange(text) } + ), + ) { + RadioButton ( + selected = (text == selected), + onClick = { onSelectedChange(text) }, + modifier = Modifier + .padding(end = Dp(0F)) +// .background(color = Color.Black) + .size(Dp(24f)) + ) + Text( + text = text, + fontSize = 16.sp, +// color = Color.White, + modifier = Modifier +// .background(color = Color.Black) + .align(Alignment.CenterVertically), + + ) + } + + } + } +} + +@Composable +fun AlignmentOptions(messageView: PayPalMessageView) { + var selected by remember { mutableStateOf("Left") } + + val radioGroupOptions = listOf("Left", "Center", "Right") + val onSelectedChange = { text: String -> + selected = text + + println("alignment options") + println(text) + + messageView.alignment = when ( text.toString() ) { + "left" -> PayPalMessageAlign.LEFT + "Center" -> PayPalMessageAlign.CENTER + "Right" -> PayPalMessageAlign.RIGHT + else -> PayPalMessageAlign.LEFT + } + } + + Row ( + horizontalArrangement = Arrangement.SpaceEvenly + ) { + radioGroupOptions.forEach { text -> + + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelectedChange(text) } + ), + ) { + RadioButton ( + selected = (text == selected), + onClick = { onSelectedChange(text) }, + modifier = Modifier + .padding(end = Dp(0F)) +// .background(color = Color.Black) + .size(Dp(24f)) + ) + Text( + text = text, + fontSize = 16.sp, +// color = Color.White, + modifier = Modifier +// .background(color = Color.Black) + .align(Alignment.CenterVertically), + + ) + } + + + } + } +} + +@Composable +fun IgnoreCacheSwitch() { + var checked by remember { mutableStateOf(false) } + + Switch( + checked = checked, + onCheckedChange = { + checked = it + Api.ignoreCache = it + } + ) + + Text (text = "Ignore Cache") +} + +@Composable +fun DevTouchpointSwitch() { + var checked by remember { mutableStateOf(false) } + + Switch( + checked = checked, + onCheckedChange = { + checked = it + Api.devTouchpoint = it + } + ) + + Text (text = "Dev Touchpoint") +} + +@Composable +fun BasicTextFieldDemo() { + var text by remember { mutableStateOf(TextFieldValue()) } + + BasicTextField( + value = text, + onValueChange = { + text = it + }, + modifier = Modifier.padding(16.dp) + ) +} + +//class ToggleButtonViewModel : ViewModel() { +// var toggleState by remember { mutableStateOf(false) } +// +// fun toggle() { +// toggleState = !toggleState +// } +//} + +//@Composable +//fun ToggleButton(viewModel: ToggleButtonViewModel = viewModel()) { +// val toggleState = viewModel.toggleState +// +// Column( +// modifier = Modifier +// .fillMaxSize() +// .background(MaterialTheme.colorScheme.primary) +// .padding(16.dp), +// verticalArrangement = Arrangement.Center +// ) { +// androidx.compose.material3.Switch( +// checked = toggleState, +// onCheckedChange = { +// viewModel.toggle() +// }, +// colors = androidx.compose.material3.SwitchDefaults.colors( +// checkedThumbColor = Color.White, +// checkedTrackColor = Color.Green, +// uncheckedTrackColor = Color.Gray +// ) +// ) +// } +//} + +fun updateMessageData(messageView: PayPalMessageView) { + messageView.refresh() +} + +fun resetButton(messageView: PayPalMessageView) { + messageView.amount = null + messageView.offerType = null + messageView.alignment = PayPalMessageAlign.LEFT + messageView.refresh() +} From 532e05c129ff40e3949c7d26178c5bd3556bef9d Mon Sep 17 00:00:00 2001 From: grablack Date: Wed, 8 Nov 2023 13:48:20 -0500 Subject: [PATCH 03/22] offer type buttons --- .../paypal/messagesdemo/JetpackActivity.kt | 206 +++++++++--------- 1 file changed, 105 insertions(+), 101 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 08f3bbeb..99cb1e2b 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -70,8 +70,18 @@ import com.paypal.messages.config.message.style.PayPalMessageAlign import com.paypal.messages.io.Api import kotlinx.coroutines.Delay import java.util.logging.Handler +import androidx.compose.animation.core.* +import androidx.compose.foundation.layout.* +import androidx.compose.material.* +import androidx.compose.runtime.* +import androidx.compose.ui.draw.clip +import androidx.compose.ui.unit.dp +import kotlinx.coroutines.launch + class JetpackActivity : ComponentActivity() { + private var backgroundColor: Color = Color.White + override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) @@ -162,8 +172,9 @@ class JetpackActivity : ComponentActivity() { ColorOptions(messageView) AlignmentOptions(messageView) - Row { + Column { Text (text = "Offer Type") + OfferButtons(messageView) } // Amount @@ -229,7 +240,9 @@ class JetpackActivity : ComponentActivity() { } AndroidView( - modifier = Modifier.fillMaxWidth(), + modifier = Modifier + .background(color = backgroundColor) + .fillMaxWidth(), factory = { _ -> messageView } @@ -238,56 +251,35 @@ class JetpackActivity : ComponentActivity() { IgnoreCacheSwitch() DevTouchpointSwitch() - FilledButtonExample(text = "Reset", onClick = { resetButton(messageView) }) - FilledButtonExample(text = "Submit", onClick = { updateMessageData(messageView) }) - + FilledButton(text = "Reset", onClick = { resetButton(messageView) }) + FilledButton(text = "Submit", onClick = { updateMessageData(messageView) }) } } } } } -} - -@Composable -fun PayPalMessagingView(clientId: String) { - Column( - modifier = Modifier.padding(16.dp).fillMaxWidth() - ) { - Box( - modifier = Modifier.fillMaxWidth() - ) { - if (clientId.isNotEmpty()) { - val config = PayPalMessageConfig( - data = PayPalMessageData(clientID = clientId) - ) - AndroidView( - factory = { context -> - val messageView = PayPalMessageView(context, config = config) - messageView.viewStateCallbacks = PayPalMessageViewStateCallbacks( - onLoading = { - Log.d("TAG", "onLoading") - }, - onError = { - Log.d("TAG", "onError") - }, - onSuccess = { - Log.d("TAG", "onSuccess") - } - ) + fun updateMessageData(messageView: PayPalMessageView) { + if ( messageView.color === PayPalMessageColor.WHITE ) { + backgroundColor = Color.Black + } - messageView + messageView.refresh() + } - } - ) - } - } + fun resetButton(messageView: PayPalMessageView) { + messageView.amount = null + messageView.offerType = null + messageView.alignment = PayPalMessageAlign.LEFT + messageView.color = PayPalMessageColor.BLACK + messageView.refresh() + backgroundColor = Color.White } } @Composable -fun FilledButtonExample(onClick: () -> Unit, text: String) { +fun FilledButton(onClick: () -> Unit, text: String) { var isButtonClicked by remember { mutableStateOf(false) } Button( // elevation = Dp(1F), @@ -305,17 +297,6 @@ fun FilledButtonExample(onClick: () -> Unit, text: String) { } } -@Composable -fun OutlinedButtonExample(onClick: () -> Unit) { -// var elevation: ButtonElevation = ButtonElevation() - OutlinedButton( -// elevation = elevation, - onClick = { onClick() }, - ) { - Text("Outlined") - } -} - @Composable fun LogoOptions(messageView: PayPalMessageView) { var selected by remember { mutableStateOf("Primary") } @@ -510,58 +491,81 @@ fun DevTouchpointSwitch() { } @Composable -fun BasicTextFieldDemo() { - var text by remember { mutableStateOf(TextFieldValue()) } - - BasicTextField( - value = text, - onValueChange = { - text = it - }, - modifier = Modifier.padding(16.dp) - ) +fun OfferButtons(messageView: PayPalMessageView) { + var button1Enabled by remember { mutableStateOf(false) } + var button2Enabled by remember { mutableStateOf(false) } + var button3Enabled by remember { mutableStateOf(false) } + var button4Enabled by remember { mutableStateOf(false) } + + Row() { + ToggleButton( + toggledState = button1Enabled, + text = "Short Term", + onClick = { + messageView.offerType = PayPalMessageOfferType.PAY_LATER_SHORT_TERM + button1Enabled = !button1Enabled + button2Enabled = false + button3Enabled = false + button4Enabled = false + } + ) + ToggleButton( + toggledState = button2Enabled, + text = "Long Term", + + onClick = { + messageView.offerType = PayPalMessageOfferType.PAY_LATER_LONG_TERM + button1Enabled = false + button2Enabled = !button2Enabled + button3Enabled = false + button4Enabled = false + } + ) + ToggleButton( + toggledState = button3Enabled, + text = "Pay in 1", + onClick = { + messageView.offerType = PayPalMessageOfferType.PAY_LATER_PAY_IN_1 + button1Enabled = false + button2Enabled = false + button3Enabled = !button3Enabled + button4Enabled = false + } + ) + ToggleButton( + toggledState = button4Enabled, + text = "Credit", + onClick = { + messageView.offerType = PayPalMessageOfferType.PAYPAL_CREDIT_NO_INTEREST + button1Enabled = false + button2Enabled = false + button3Enabled = false + button4Enabled = !button4Enabled + } + ) + } } -//class ToggleButtonViewModel : ViewModel() { -// var toggleState by remember { mutableStateOf(false) } -// -// fun toggle() { -// toggleState = !toggleState -// } -//} - -//@Composable -//fun ToggleButton(viewModel: ToggleButtonViewModel = viewModel()) { -// val toggleState = viewModel.toggleState -// -// Column( -// modifier = Modifier -// .fillMaxSize() -// .background(MaterialTheme.colorScheme.primary) -// .padding(16.dp), -// verticalArrangement = Arrangement.Center -// ) { -// androidx.compose.material3.Switch( -// checked = toggleState, -// onCheckedChange = { -// viewModel.toggle() -// }, -// colors = androidx.compose.material3.SwitchDefaults.colors( -// checkedThumbColor = Color.White, -// checkedTrackColor = Color.Green, -// uncheckedTrackColor = Color.Gray -// ) -// ) -// } -//} - -fun updateMessageData(messageView: PayPalMessageView) { - messageView.refresh() -} +@Composable +fun ToggleButton( toggledState: Boolean, text: String, onClick: () -> Unit) { -fun resetButton(messageView: PayPalMessageView) { - messageView.amount = null - messageView.offerType = null - messageView.alignment = PayPalMessageAlign.LEFT - messageView.refresh() + Button( +// shape = RoundedCornerShape(8.dp), + colors = when(toggledState) { + true -> ButtonDefaults.outlinedButtonColors() + else -> ButtonDefaults.elevatedButtonColors() + }, + elevation = ButtonDefaults.elevatedButtonElevation(), + contentPadding = PaddingValues(start = 6.dp, top = 0.dp, end = 12.dp, bottom = 0.dp), + modifier = Modifier + .height(IntrinsicSize.Max), +// .border( +// width = 2.dp, // Border width +// color = Color.LightGray, // Border color +//// shape = MaterialTheme.shapes.small +// ), + onClick = onClick + ) { + Text(text) + } } From 8e790925ee3fd5684be1d94bd38aa2ca85b53fbb Mon Sep 17 00:00:00 2001 From: grablack Date: Wed, 15 Nov 2023 14:33:33 -0500 Subject: [PATCH 04/22] switching colors --- .../paypal/messagesdemo/JetpackActivity.kt | 210 ++++++++---------- .../main/res/layout/paypal_message_view.xml | 14 +- 2 files changed, 103 insertions(+), 121 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 99cb1e2b..90ffccc8 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -1,86 +1,52 @@ package com.paypal.messagesdemo import android.os.Bundle -import android.util.Log -import android.view.View import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.foundation.layout.* -import androidx.compose.runtime.* import androidx.compose.ui.Modifier import androidx.compose.ui.platform.LocalContext -import androidx.compose.ui.res.painterResource import androidx.compose.ui.viewinterop.AndroidView -import com.paypal.messages.Logo -import com.paypal.messages.LogoAsset import com.paypal.messages.PayPalMessageView import com.paypal.messages.config.PayPalEnvironment -import com.paypal.messages.config.ProductGroup import com.paypal.messages.config.message.style.PayPalMessageColor import com.paypal.messages.config.message.style.PayPalMessageLogoType import com.paypal.messagesdemo.ui.BasicTheme - -import android.view.ViewGroup -import android.widget.RadioGroup -import android.widget.ScrollView import android.widget.Toast -import android.widget.ToggleButton import androidx.compose.foundation.* import androidx.compose.material3.* import androidx.compose.runtime.Composable -import androidx.compose.ui.tooling.preview.Preview import androidx.compose.runtime.getValue -import androidx.compose.ui.platform.ComposeView -import androidx.compose.ui.platform.ViewCompositionStrategy import androidx.compose.ui.text.input.TextFieldValue -import androidx.compose.ui.viewinterop.AndroidView -import androidx.fragment.app.Fragment import androidx.compose.foundation.layout.Column - import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.width -import androidx.compose.foundation.layout.wrapContentWidth -import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.selection.selectable -import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.foundation.text.BasicTextField - -import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment -import androidx.compose.ui.graphics.Brush import androidx.compose.ui.graphics.Color -import androidx.compose.ui.graphics.graphicsLayer -import androidx.compose.ui.res.painterResource -import androidx.compose.ui.state.ToggleableState -import androidx.compose.ui.text.TextStyle -import androidx.compose.ui.text.font.FontFamily import androidx.compose.ui.unit.* -import androidx.lifecycle.ViewModel -//import androidx.lifecycle.viewmodel.compose.viewModel -import androidx.compose.material3.ButtonElevation import com.paypal.messages.config.PayPalMessageOfferType import com.paypal.messages.config.message.* import com.paypal.messages.config.message.style.PayPalMessageAlign import com.paypal.messages.io.Api -import kotlinx.coroutines.Delay -import java.util.logging.Handler -import androidx.compose.animation.core.* -import androidx.compose.foundation.layout.* -import androidx.compose.material.* -import androidx.compose.runtime.* -import androidx.compose.ui.draw.clip import androidx.compose.ui.unit.dp -import kotlinx.coroutines.launch +fun toSentenceCase(input: String): String { + // Convert the string to lowercase and split it into words + val words = input.toLowerCase().split(" ") + + // Capitalize the first letter of each word and join them back into a string + val sentenceCase = words.joinToString(" ") { it.capitalize() } + + return sentenceCase +} class JetpackActivity : ComponentActivity() { - private var backgroundColor: Color = Color.White override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) @@ -88,6 +54,14 @@ class JetpackActivity : ComponentActivity() { setContent { BasicTheme { val context = LocalContext.current + var backgroundColor by remember { mutableStateOf(Color.White) } + val colorGroupOptions = listOf( + toSentenceCase(PayPalMessageColor.BLACK.name), + toSentenceCase(PayPalMessageColor.WHITE.name), + toSentenceCase(PayPalMessageColor.MONOCHROME.name), + toSentenceCase(PayPalMessageColor.GRAYSCALE.name) + ) + var messageColor by remember { mutableStateOf(colorGroupOptions[0])} val messageView = PayPalMessageView(context, config = PayPalMessageConfig( @@ -123,6 +97,65 @@ class JetpackActivity : ComponentActivity() { ) ) + + @Composable + fun ColorOptions(messageView: PayPalMessageView, colorGroupOptions: List, selected: String, onSelect: (text: String) -> Unit) { + val onSelectedChange = onSelect + + Row ( + horizontalArrangement = Arrangement.SpaceEvenly + ) { + colorGroupOptions.forEach { text -> + + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelectedChange(text) } + ), + ) { + RadioButton ( + selected = (text == selected), + onClick = { onSelectedChange(text) }, + modifier = Modifier + .padding(end = Dp(0F)) + .size(Dp(24f)) + ) + Text( + text = text, + fontSize = 16.sp, + modifier = Modifier + .align(Alignment.CenterVertically) + ) + } + + } + } + } + + fun updateMessageData() { + + if ( messageView.color === PayPalMessageColor.WHITE ) { + backgroundColor = Color.Black + } else { + backgroundColor = Color.White + } + + messageView.refresh() + } + + fun resetButton(messageView: PayPalMessageView) { + messageView.amount = null + messageView.offerType = null + messageView.alignment = PayPalMessageAlign.LEFT + messageColor = "Black" + messageView.color = PayPalMessageColor.BLACK + println("set color: ${messageView.color}") + updateMessageData() + } + // A surface container using the 'background' color from the theme Surface(modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background) { Column ( @@ -169,13 +202,24 @@ class JetpackActivity : ComponentActivity() { Text("Style Options") LogoOptions(messageView) - ColorOptions(messageView) + + + ColorOptions( + messageView = messageView, + colorGroupOptions = colorGroupOptions, + selected = messageColor, + onSelect = { text: String -> + // Sets the Radio UI element + messageColor = text.toString() + + // Sets style color option + messageView.color = PayPalMessageColor.valueOf(messageColor.uppercase()) + println("\nmessage view set to ${messageView.color}") + }) AlignmentOptions(messageView) - Column { - Text (text = "Offer Type") - OfferButtons(messageView) - } + Text (text = "Offer Type") + OfferButtons(messageView) // Amount Row ( @@ -252,7 +296,7 @@ class JetpackActivity : ComponentActivity() { DevTouchpointSwitch() FilledButton(text = "Reset", onClick = { resetButton(messageView) }) - FilledButton(text = "Submit", onClick = { updateMessageData(messageView) }) + FilledButton(text = "Submit", onClick = { updateMessageData() }) } } @@ -260,22 +304,7 @@ class JetpackActivity : ComponentActivity() { } } - fun updateMessageData(messageView: PayPalMessageView) { - if ( messageView.color === PayPalMessageColor.WHITE ) { - backgroundColor = Color.Black - } - messageView.refresh() - } - - fun resetButton(messageView: PayPalMessageView) { - messageView.amount = null - messageView.offerType = null - messageView.alignment = PayPalMessageAlign.LEFT - messageView.color = PayPalMessageColor.BLACK - messageView.refresh() - backgroundColor = Color.White - } } @Composable @@ -350,59 +379,6 @@ fun LogoOptions(messageView: PayPalMessageView) { } } -@Composable -fun ColorOptions(messageView: PayPalMessageView) { - var selected by remember { mutableStateOf("Black") } - - val radioGroupOptions = listOf("Black", "White", "Monochorme", "Grayscale") - val onSelectedChange = { text: String -> - selected = text - messageView.color = when ( text.toString() ) { - "Black" -> PayPalMessageColor.BLACK - "White" -> PayPalMessageColor.WHITE - "Monochorme" -> PayPalMessageColor.MONOCHROME - "Grayscale" -> PayPalMessageColor.GRAYSCALE - else -> PayPalMessageColor.BLACK - } - } - - Row ( - horizontalArrangement = Arrangement.SpaceEvenly - ) { - radioGroupOptions.forEach { text -> - - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelectedChange(text) } - ), - ) { - RadioButton ( - selected = (text == selected), - onClick = { onSelectedChange(text) }, - modifier = Modifier - .padding(end = Dp(0F)) -// .background(color = Color.Black) - .size(Dp(24f)) - ) - Text( - text = text, - fontSize = 16.sp, -// color = Color.White, - modifier = Modifier -// .background(color = Color.Black) - .align(Alignment.CenterVertically), - - ) - } - - } - } -} - @Composable fun AlignmentOptions(messageView: PayPalMessageView) { var selected by remember { mutableStateOf("Left") } diff --git a/library/src/main/res/layout/paypal_message_view.xml b/library/src/main/res/layout/paypal_message_view.xml index 4fdb193c..e63a2f03 100644 --- a/library/src/main/res/layout/paypal_message_view.xml +++ b/library/src/main/res/layout/paypal_message_view.xml @@ -1,6 +1,12 @@ - + android:layout_height="match_parent"> + + + From ba649227fe19b9e033184a1e275fe6d55251dad7 Mon Sep 17 00:00:00 2001 From: grablack Date: Mon, 27 Nov 2023 15:01:13 -0500 Subject: [PATCH 05/22] needs to set field to check against --- .../src/main/java/com/paypal/messages/PayPalMessageView.kt | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/library/src/main/java/com/paypal/messages/PayPalMessageView.kt b/library/src/main/java/com/paypal/messages/PayPalMessageView.kt index 1606ab54..38b9c268 100644 --- a/library/src/main/java/com/paypal/messages/PayPalMessageView.kt +++ b/library/src/main/java/com/paypal/messages/PayPalMessageView.kt @@ -96,11 +96,13 @@ class PayPalMessageView @JvmOverloads constructor( data = data.merge(MessageData(amount = amountArg)) modal?.amount = amountArg } + field = amountArg } var placement: String? = data.placement get() = data.placement set(placementArg) { if (field != placementArg) data = data.merge(MessageData(placement = placementArg)) + field = placementArg } var offerType: OfferType? = data.offerType get() = data.offerType @@ -109,6 +111,7 @@ class PayPalMessageView @JvmOverloads constructor( data = data.merge(MessageData(offerType = offerArg)) modal?.offerType = offerArg } + field = offerArg } var buyerCountry: String? = data.buyerCountry get() = data.buyerCountry @@ -138,16 +141,19 @@ class PayPalMessageView @JvmOverloads constructor( get() = style.color ?: Color.BLACK set(colorArg) { if (field != colorArg) style = style.merge(MessageStyle(color = colorArg)) + field = colorArg } var logoType: LogoType = LogoType.PRIMARY get() = style.logoType ?: LogoType.PRIMARY set(logoTypeArg) { if (field != logoTypeArg) style = style.merge(MessageStyle(logoType = logoTypeArg)) + field = logoTypeArg } var alignment: Align = Align.LEFT get() = style.textAlign ?: Align.LEFT set(alignmentArg) { if (field != alignmentArg) style = style.merge(MessageStyle(textAlign = alignmentArg)) + field = alignmentArg } // VIEW STATE CALLBACKS From 051f2eae125b92e4b1a83c1cfa6a19788e8dac88 Mon Sep 17 00:00:00 2001 From: grablack Date: Mon, 27 Nov 2023 16:53:34 -0500 Subject: [PATCH 06/22] top level variables --- .../paypal/messagesdemo/JetpackActivity.kt | 374 ++++++++++-------- 1 file changed, 205 insertions(+), 169 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 90ffccc8..6c55cacf 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -24,11 +24,14 @@ import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.selection.selectable +import androidx.compose.foundation.text.KeyboardOptions import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.graphics.Color +import androidx.compose.ui.text.input.ImeAction +import androidx.compose.ui.text.input.KeyboardType import androidx.compose.ui.unit.* import com.paypal.messages.config.PayPalMessageOfferType import com.paypal.messages.config.message.* @@ -54,6 +57,10 @@ class JetpackActivity : ComponentActivity() { setContent { BasicTheme { val context = LocalContext.current + + // Client ID + + // Style Color var backgroundColor by remember { mutableStateOf(Color.White) } val colorGroupOptions = listOf( toSentenceCase(PayPalMessageColor.BLACK.name), @@ -63,6 +70,31 @@ class JetpackActivity : ComponentActivity() { ) var messageColor by remember { mutableStateOf(colorGroupOptions[0])} + // Style Logo + val logoGroupOptions = listOf( + toSentenceCase(PayPalMessageLogoType.PRIMARY.name), + toSentenceCase(PayPalMessageLogoType.INLINE.name), + toSentenceCase(PayPalMessageLogoType.ALTERNATIVE.name), + toSentenceCase(PayPalMessageLogoType.NONE.name) + ) + var messageLogo by remember { mutableStateOf(logoGroupOptions[0])} + + // Style Aligntment + val alignmentGroupOptions = listOf( + toSentenceCase(PayPalMessageAlign.LEFT.name), + toSentenceCase(PayPalMessageAlign.CENTER.name), + toSentenceCase(PayPalMessageAlign.RIGHT.name) + ) + var messageAlignment by remember { mutableStateOf(alignmentGroupOptions[0])} + + // Offer Type + + var amount by remember { mutableStateOf("") } + var buyerCountry by remember { mutableStateOf("") } + var stageTag by remember { mutableStateOf("") } + // ignore cache + // dev touchpoint + val messageView = PayPalMessageView(context, config = PayPalMessageConfig( data = PayPalMessageData(clientID = "B_Aksh3K8UpGwAs_Ngi0ahNHJja2bsxqtuqmhRAm944xzM-p6Qkq9JbqFc2yTz2Fg5WYtcW1QEu_tHDVuI", environment = PayPalEnvironment.SANDBOX), @@ -97,62 +129,47 @@ class JetpackActivity : ComponentActivity() { ) ) - - @Composable - fun ColorOptions(messageView: PayPalMessageView, colorGroupOptions: List, selected: String, onSelect: (text: String) -> Unit) { - val onSelectedChange = onSelect - - Row ( - horizontalArrangement = Arrangement.SpaceEvenly - ) { - colorGroupOptions.forEach { text -> - - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelectedChange(text) } - ), - ) { - RadioButton ( - selected = (text == selected), - onClick = { onSelectedChange(text) }, - modifier = Modifier - .padding(end = Dp(0F)) - .size(Dp(24f)) - ) - Text( - text = text, - fontSize = 16.sp, - modifier = Modifier - .align(Alignment.CenterVertically) - ) - } - - } - } - } - fun updateMessageData() { - if ( messageView.color === PayPalMessageColor.WHITE ) { + if ( PayPalMessageColor.valueOf(messageColor.uppercase()) === PayPalMessageColor.WHITE ) { backgroundColor = Color.Black } else { backgroundColor = Color.White } + messageView.color = PayPalMessageColor.valueOf(messageColor.uppercase()) + messageView.logoType = PayPalMessageLogoType.valueOf(messageLogo.uppercase()) + messageView.alignment = PayPalMessageAlign.valueOf((messageAlignment.uppercase())) + // offer type + + messageView.amount = amount.toDouble() ?: null + messageView.buyerCountry = buyerCountry + Api.stageTag = stageTag + + // ignore cache + + // dev touchpoint + messageView.refresh() } - fun resetButton(messageView: PayPalMessageView) { - messageView.amount = null - messageView.offerType = null - messageView.alignment = PayPalMessageAlign.LEFT - messageColor = "Black" - messageView.color = PayPalMessageColor.BLACK - println("set color: ${messageView.color}") + fun resetButton() { + messageColor = colorGroupOptions[0] + messageLogo = logoGroupOptions[0] + messageAlignment = alignmentGroupOptions[0] + // offer type + + // amount + amount = "" + + // country + + // stage tag + + // ignore cache + + // dev touchpoint + updateMessageData() } @@ -201,87 +218,45 @@ class JetpackActivity : ComponentActivity() { Text("Style Options") - LogoOptions(messageView) - + LogoOptions( + logoGroupOptions = logoGroupOptions, + selected = messageLogo, + onSelected = { text: String -> + messageLogo = text.toString() + } + ) ColorOptions( - messageView = messageView, colorGroupOptions = colorGroupOptions, selected = messageColor, - onSelect = { text: String -> - // Sets the Radio UI element + onSelected = { text: String -> messageColor = text.toString() + } + ) - // Sets style color option - messageView.color = PayPalMessageColor.valueOf(messageColor.uppercase()) - println("\nmessage view set to ${messageView.color}") - }) - AlignmentOptions(messageView) - - Text (text = "Offer Type") - OfferButtons(messageView) - - // Amount - Row ( - modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) - ) { - Text(text = "Amount", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) - var text by remember { mutableStateOf(TextFieldValue("")) } - - TextField( - value = text, - onValueChange = { - text = it - messageView.amount = it.text.toDouble() - }, - placeholder = { Text(text = "0.00") }, - modifier = Modifier - .height(Dp(value = 64F)) - .padding(all = 1.dp) - ) - - } + AlignmentOptions( + alignmentGroupOptions = alignmentGroupOptions, + selected = messageAlignment, + onSelected = { text: String -> + messageAlignment = text.toString() + } + ) - // Buyer Country - Row ( - modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) - ) { - Text(text = "Buyer Country", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) - var text by remember { mutableStateOf(TextFieldValue("")) } + Text ("Offer Type") - TextField( - value = text, - onValueChange = { - text = it - messageView.buyerCountry = it.text.toString() - }, - placeholder = { Text(text = "US") }, - modifier = Modifier - .height(Dp(value = 64F)) - .padding(all = 1.dp) - ) - - } + OfferButtons(messageView) - // Stage Tag - Row ( - modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) - ) { - Text(text = "Stage Tag", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) - var text by remember { mutableStateOf(TextFieldValue("")) } + AmountField( + amount = amount, + onChange = { amount = it } + ) - TextField( - value = text, - onValueChange = { - text = it - Api.stageTag = it.text.toString() - }, - modifier = Modifier - .height(Dp(value = 64F)) - .padding(all = 1.dp) - ) + BuyerCountryField( + country = buyerCountry, + onChange = { buyerCountry = it } + ) - } + StageTagField(stageTag, onChange = { stageTag = it }) AndroidView( modifier = Modifier @@ -295,7 +270,7 @@ class JetpackActivity : ComponentActivity() { IgnoreCacheSwitch() DevTouchpointSwitch() - FilledButton(text = "Reset", onClick = { resetButton(messageView) }) + FilledButton(text = "Reset", onClick = { resetButton() }) FilledButton(text = "Submit", onClick = { updateMessageData() }) } @@ -303,43 +278,11 @@ class JetpackActivity : ComponentActivity() { } } } - - } @Composable -fun FilledButton(onClick: () -> Unit, text: String) { - var isButtonClicked by remember { mutableStateOf(false) } - Button( -// elevation = Dp(1F), - onClick = { - onClick() - isButtonClicked = !isButtonClicked - }, -// modifier = Modifier -// .graphicsLayer( -// scaleX = if (isButtonClicked) 1.2f else 1f, -// scaleY = if (isButtonClicked) 1.2f else 1f -// ) - ) { - Text(text) - } -} - -@Composable -fun LogoOptions(messageView: PayPalMessageView) { - var selected by remember { mutableStateOf("Primary") } - val radioGroupOptions = listOf("Primary", "Inline", "Alternative", "None") - val onSelectedChange = { text: String -> - selected = text - messageView.logoType = when ( text.toString() ) { - "Primary" -> PayPalMessageLogoType.PRIMARY - "Inline" -> PayPalMessageLogoType.INLINE - "Alternative" -> PayPalMessageLogoType.ALTERNATIVE - "None" -> PayPalMessageLogoType.NONE - else -> PayPalMessageLogoType.PRIMARY - } - } +fun LogoOptions( logoGroupOptions: List, selected: String, onSelected: (text: String) -> Unit ) { + val radioGroupOptions = logoGroupOptions Row ( horizontalArrangement = Arrangement.SpaceEvenly @@ -352,12 +295,12 @@ fun LogoOptions(messageView: PayPalMessageView) { .padding(end = Dp(8.0F)) .selectable( selected = (text == selected), - onClick = { onSelectedChange(text) } + onClick = { onSelected(text) } ), ) { RadioButton ( selected = (text == selected), - onClick = { onSelectedChange(text) }, + onClick = { onSelected(text) }, modifier = Modifier .padding(end = Dp(0F)) // .background(color = Color.Black) @@ -380,28 +323,48 @@ fun LogoOptions(messageView: PayPalMessageView) { } @Composable -fun AlignmentOptions(messageView: PayPalMessageView) { - var selected by remember { mutableStateOf("Left") } +fun ColorOptions(colorGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { - val radioGroupOptions = listOf("Left", "Center", "Right") - val onSelectedChange = { text: String -> - selected = text + Row ( + horizontalArrangement = Arrangement.SpaceEvenly + ) { + colorGroupOptions.forEach { text -> - println("alignment options") - println(text) + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelected(text) } + ), + ) { + RadioButton ( + selected = (text == selected), + onClick = { onSelected(text) }, + modifier = Modifier + .padding(end = Dp(0F)) + .size(Dp(24f)) + ) + Text( + text = text, + fontSize = 16.sp, + modifier = Modifier + .align(Alignment.CenterVertically) + ) + } - messageView.alignment = when ( text.toString() ) { - "left" -> PayPalMessageAlign.LEFT - "Center" -> PayPalMessageAlign.CENTER - "Right" -> PayPalMessageAlign.RIGHT - else -> PayPalMessageAlign.LEFT } } +} + +@Composable +fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { Row ( horizontalArrangement = Arrangement.SpaceEvenly ) { - radioGroupOptions.forEach { text -> + alignmentGroupOptions.forEach { text -> Row( modifier = Modifier @@ -409,12 +372,12 @@ fun AlignmentOptions(messageView: PayPalMessageView) { .padding(end = Dp(8.0F)) .selectable( selected = (text == selected), - onClick = { onSelectedChange(text) } + onClick = { onSelected(text) } ), ) { RadioButton ( selected = (text == selected), - onClick = { onSelectedChange(text) }, + onClick = { onSelected(text) }, modifier = Modifier .padding(end = Dp(0F)) // .background(color = Color.Black) @@ -431,11 +394,71 @@ fun AlignmentOptions(messageView: PayPalMessageView) { ) } - } } } +@Composable +fun AmountField(amount: String, onChange: (text: String) -> Unit){ + + Row ( + modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) + ) { + Text(text = "Amount", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + + TextField( + value = amount, + onValueChange = onChange, + placeholder = { Text(text = "0.00") }, + keyboardOptions = KeyboardOptions.Default.copy( + keyboardType = KeyboardType.Number, + imeAction = ImeAction.Done + ), + modifier = Modifier + .height(Dp(value = 64F)) + .padding(all = 1.dp) + ) + + } +} + +@Composable +fun BuyerCountryField(country: String, onChange: (text: String) -> Unit){ + Row ( + modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) + ) { + Text(text = "Buyer Country", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + + TextField( + value = country, + onValueChange = onChange, + placeholder = { Text(text = "US") }, + modifier = Modifier + .height(Dp(value = 64F)) + .padding(all = 1.dp) + ) + + } +} + +@Composable +fun StageTagField( stageTag: String, onChange: (text: String) -> Unit){ + Row ( + modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) + ) { + Text(text = "Stage Tag", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + + TextField( + value = stageTag, + onValueChange = onChange, + modifier = Modifier + .height(Dp(value = 64F)) + .padding(all = 1.dp) + ) + + } +} + @Composable fun IgnoreCacheSwitch() { var checked by remember { mutableStateOf(false) } @@ -545,3 +568,16 @@ fun ToggleButton( toggledState: Boolean, text: String, onClick: () -> Unit) { Text(text) } } + +@Composable +fun FilledButton(onClick: () -> Unit, text: String) { + var isButtonClicked by remember { mutableStateOf(false) } + Button( + onClick = { + onClick() + isButtonClicked = !isButtonClicked + }, + ) { + Text(text) + } +} From 31408b5a04620d6298a5b3013a2d857851e20948 Mon Sep 17 00:00:00 2001 From: grablack Date: Thu, 30 Nov 2023 09:32:32 -0500 Subject: [PATCH 07/22] styling --- .../paypal/messagesdemo/JetpackActivity.kt | 487 ++++++++++-------- 1 file changed, 279 insertions(+), 208 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 6c55cacf..b75202c5 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -1,6 +1,8 @@ package com.paypal.messagesdemo +import android.content.ContentValues.TAG import android.os.Bundle +import android.util.Log import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.foundation.layout.* @@ -17,19 +19,20 @@ import androidx.compose.foundation.* import androidx.compose.material3.* import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue -import androidx.compose.ui.text.input.TextFieldValue import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.selection.selectable +import androidx.compose.foundation.text.BasicTextField import androidx.compose.foundation.text.KeyboardOptions import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.RectangleShape import androidx.compose.ui.text.input.ImeAction import androidx.compose.ui.text.input.KeyboardType import androidx.compose.ui.unit.* @@ -38,6 +41,7 @@ import com.paypal.messages.config.message.* import com.paypal.messages.config.message.style.PayPalMessageAlign import com.paypal.messages.io.Api import androidx.compose.ui.unit.dp +import androidx.compose.ui.text.font.FontWeight fun toSentenceCase(input: String): String { // Convert the string to lowercase and split it into words @@ -59,6 +63,7 @@ class JetpackActivity : ComponentActivity() { val context = LocalContext.current // Client ID + var clientId: String by remember { mutableStateOf("B_Aksh3K8UpGwAs_Ngi0ahNHJja2bsxqtuqmhRAm944xzM-p6Qkq9JbqFc2yTz2Fg5WYtcW1QEu_tHDVuI") } // Style Color var backgroundColor by remember { mutableStateOf(Color.White) } @@ -88,40 +93,41 @@ class JetpackActivity : ComponentActivity() { var messageAlignment by remember { mutableStateOf(alignmentGroupOptions[0])} // Offer Type + var offerButton1 by remember { mutableStateOf(false) } + var offerButton2 by remember { mutableStateOf(false) } + var offerButton3 by remember { mutableStateOf(false) } + var offerButton4 by remember { mutableStateOf(false) } - var amount by remember { mutableStateOf("") } - var buyerCountry by remember { mutableStateOf("") } - var stageTag by remember { mutableStateOf("") } - // ignore cache - // dev touchpoint + var amount: String by remember { mutableStateOf("") } + var buyerCountry: String by remember { mutableStateOf("") } + var stageTag: String by remember { mutableStateOf("") } + var ignoreCache: Boolean by remember { mutableStateOf(false) } + var devTouchpoint: Boolean by remember { mutableStateOf(false) } + + var buttonEnabled: Boolean by remember { mutableStateOf(true) } val messageView = PayPalMessageView(context, config = PayPalMessageConfig( - data = PayPalMessageData(clientID = "B_Aksh3K8UpGwAs_Ngi0ahNHJja2bsxqtuqmhRAm944xzM-p6Qkq9JbqFc2yTz2Fg5WYtcW1QEu_tHDVuI", environment = PayPalEnvironment.SANDBOX), + data = PayPalMessageData(clientID = clientId, environment = PayPalEnvironment.SANDBOX), viewStateCallbacks = PayPalMessageViewStateCallbacks( onLoading = { // progressBar.visibility = View.VISIBLE -// resetButton.isEnabled = false -// submitButton.isEnabled = false + buttonEnabled = false Toast.makeText(this, "Loading Content...", Toast.LENGTH_SHORT).show() }, onError = { -// Log.d(TAG, "onError") + Log.d(TAG, "onError") // progressBar.visibility = View.INVISIBLE runOnUiThread { -// resetButton.isEnabled = true -// submitButton.isEnabled = true + buttonEnabled = true Toast.makeText(this, it.javaClass.toString() + ":" + it.message, Toast.LENGTH_LONG).show() } -// it.message?.let { it1 -> Log.d("XmlActivity Error", it1) } -// it.paypalDebugId?.let { it1 -> Log.d("XmlActivity Error", it1) } }, onSuccess = { -// Log.d(TAG, "onSuccess") + Log.d(TAG, "onSuccess") // progressBar.visibility = View.INVISIBLE runOnUiThread { -// resetButton.isEnabled = true -// submitButton.isEnabled = true + buttonEnabled = true Toast.makeText(this, "Success Getting Content", Toast.LENGTH_SHORT).show() } }, @@ -131,6 +137,8 @@ class JetpackActivity : ComponentActivity() { fun updateMessageData() { + messageView.clientId = clientId + if ( PayPalMessageColor.valueOf(messageColor.uppercase()) === PayPalMessageColor.WHITE ) { backgroundColor = Color.Black } else { @@ -140,15 +148,20 @@ class JetpackActivity : ComponentActivity() { messageView.color = PayPalMessageColor.valueOf(messageColor.uppercase()) messageView.logoType = PayPalMessageLogoType.valueOf(messageLogo.uppercase()) messageView.alignment = PayPalMessageAlign.valueOf((messageAlignment.uppercase())) - // offer type - messageView.amount = amount.toDouble() ?: null - messageView.buyerCountry = buyerCountry - Api.stageTag = stageTag + messageView.amount = when ( amount.isBlank() ) { + true -> null + false -> amount.toDouble() + } - // ignore cache + messageView.buyerCountry = when( buyerCountry.isBlank() ) { + true -> null + false -> buyerCountry + } - // dev touchpoint + Api.stageTag = stageTag + Api.ignoreCache = ignoreCache + Api.devTouchpoint = devTouchpoint messageView.refresh() } @@ -157,66 +170,43 @@ class JetpackActivity : ComponentActivity() { messageColor = colorGroupOptions[0] messageLogo = logoGroupOptions[0] messageAlignment = alignmentGroupOptions[0] - // offer type - // amount - amount = "" + messageView.offerType = null + offerButton1 = false + offerButton2 = false + offerButton3 = false + offerButton4 = false - // country - - // stage tag - - // ignore cache - - // dev touchpoint + amount = "" + buyerCountry = "" + stageTag = "" + ignoreCache = false + devTouchpoint = false updateMessageData() } // A surface container using the 'background' color from the theme - Surface(modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background) { + Surface(modifier = Modifier.fillMaxSize().padding(start = 12.dp, end = 12.dp), color = MaterialTheme.colorScheme.background) { Column ( modifier = Modifier.verticalScroll(state = rememberScrollState()) ){ - Row { - Text (text = "Message Configuration") - } - - // Client ID - // TODO Change back to Row, Make Input look better - Column ( - modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) - ) { - Text( text = "Client Id", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) - var text by remember { mutableStateOf(TextFieldValue( messageView.clientId)) } - -// BasicTextField( -// value = text, -// onValueChange = { -// text = it -// }, -// textStyle = TextStyle(fontSize = 16.sp, color = Color.Black), -// modifier = Modifier -// .fillMaxWidth() // To make the TextField occupy the full width -// .padding(4.dp) // Customize the padding here -//// .background(Color(239f, 239f, 239f)) -// ) - TextField( - value = text, - onValueChange = { - text = it - messageView.clientId = it.text.toString() - }, - placeholder = { Text(text = "Client Id") }, - modifier = Modifier - .height(Dp(value = 64F)) - .padding(all = 1.dp) - ) + Text(text = "Message Configuration", fontSize = 20.sp, fontWeight = FontWeight.Bold, modifier = Modifier.padding(top = 8.dp)) - } + ClientIdField( + text = "Client ID", + clientId = clientId, + onChange = { + clientId = it + } + ) - Text("Style Options") + Text(text = "Style Options", fontSize = 14.sp, fontWeight = FontWeight.Bold, + modifier = Modifier + .width(125.dp) + .height(intrinsicSize = IntrinsicSize.Max) + ) LogoOptions( logoGroupOptions = logoGroupOptions, @@ -242,9 +232,44 @@ class JetpackActivity : ComponentActivity() { } ) - Text ("Offer Type") - - OfferButtons(messageView) + OfferButtons( + offerButton1 = offerButton1, + offer1 = "Short Term", + offerButton1Click = { + messageView.offerType = PayPalMessageOfferType.PAY_LATER_SHORT_TERM + offerButton1 = !offerButton1 + offerButton2 = false + offerButton3 = false + offerButton4 = false + }, + offerButton2 = offerButton2, + offer2 = "Long Term", + offerButton2Click = { + messageView.offerType = PayPalMessageOfferType.PAY_LATER_LONG_TERM + offerButton1 = false + offerButton2 = !offerButton2 + offerButton3 = false + offerButton4 = false + }, + offerButton3 = offerButton3, + offer3 = "Pay in 1", + offerButton3Click = { + messageView.offerType = PayPalMessageOfferType.PAY_LATER_PAY_IN_1 + offerButton1 = false + offerButton2 = false + offerButton3 = !offerButton3 + offerButton4 = false + }, + offerButton4 = offerButton4, + offer4 = "Credit", + offerButton4Click = { + messageView.offerType = PayPalMessageOfferType.PAYPAL_CREDIT_NO_INTEREST + offerButton1 = false + offerButton2 = false + offerButton3 = false + offerButton4 = !offerButton4 + } + ) AmountField( amount = amount, @@ -258,8 +283,17 @@ class JetpackActivity : ComponentActivity() { StageTagField(stageTag, onChange = { stageTag = it }) + Row ( + horizontalArrangement = Arrangement.SpaceBetween, + modifier = Modifier.fillMaxWidth().padding(vertical = 8.dp) + ){ + IgnoreCacheSwitch(ignoreCache = ignoreCache, onChange = { ignoreCache = it }) + DevTouchpointSwitch(devTouchpoint = devTouchpoint, onChange = { devTouchpoint = it }) + } + AndroidView( modifier = Modifier + .padding(top = 16.dp, bottom = 32.dp, start = 8.dp, end = 8.dp) .background(color = backgroundColor) .fillMaxWidth(), factory = { _ -> @@ -267,11 +301,13 @@ class JetpackActivity : ComponentActivity() { } ) - IgnoreCacheSwitch() - DevTouchpointSwitch() - - FilledButton(text = "Reset", onClick = { resetButton() }) - FilledButton(text = "Submit", onClick = { updateMessageData() }) + Row ( + horizontalArrangement = Arrangement.SpaceBetween, + modifier = Modifier.fillMaxWidth() + ){ + FilledButton(text = "Reset", onClick = { resetButton() }, buttonEnabled = buttonEnabled) + FilledButton(text = "Submit", onClick = { updateMessageData() }, buttonEnabled = buttonEnabled) + } } } @@ -280,12 +316,34 @@ class JetpackActivity : ComponentActivity() { } } +@Composable +fun ClientIdField(clientId: String, onChange: (text: String) -> Unit, text: String) { + Row ( + modifier = Modifier.padding(vertical = 16.dp) + ) { + Text(text = text, fontSize = 14.sp, fontWeight = FontWeight.Bold, + modifier = Modifier + .width(125.dp) + .height(intrinsicSize = IntrinsicSize.Max) + .align(Alignment.CenterVertically) + ) + + StyledTextField( + value = clientId, + onChange = onChange, + placeholder = text + ) + + } +} + @Composable fun LogoOptions( logoGroupOptions: List, selected: String, onSelected: (text: String) -> Unit ) { val radioGroupOptions = logoGroupOptions Row ( - horizontalArrangement = Arrangement.SpaceEvenly + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(top = 8.dp) ) { radioGroupOptions.forEach { text -> @@ -303,21 +361,15 @@ fun LogoOptions( logoGroupOptions: List, selected: String, onSelected: ( onClick = { onSelected(text) }, modifier = Modifier .padding(end = Dp(0F)) -// .background(color = Color.Black) .size(Dp(24f)) ) Text( text = text, fontSize = 16.sp, -// color = Color.White, modifier = Modifier -// .background(color = Color.Black) - .align(Alignment.CenterVertically), - + .align(Alignment.CenterVertically) ) } - - } } } @@ -326,7 +378,8 @@ fun LogoOptions( logoGroupOptions: List, selected: String, onSelected: ( fun ColorOptions(colorGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { Row ( - horizontalArrangement = Arrangement.SpaceEvenly + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(vertical = 4.dp) ) { colorGroupOptions.forEach { text -> @@ -348,12 +401,11 @@ fun ColorOptions(colorGroupOptions: List, selected: String, onSelected: ) Text( text = text, - fontSize = 16.sp, + fontSize = 14.sp, modifier = Modifier .align(Alignment.CenterVertically) ) } - } } } @@ -362,10 +414,11 @@ fun ColorOptions(colorGroupOptions: List, selected: String, onSelected: fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { Row ( - horizontalArrangement = Arrangement.SpaceEvenly + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(vertical = 4.dp) ) { - alignmentGroupOptions.forEach { text -> + alignmentGroupOptions.forEach { text -> Row( modifier = Modifier .height(intrinsicSize = IntrinsicSize.Max) @@ -380,17 +433,14 @@ fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSe onClick = { onSelected(text) }, modifier = Modifier .padding(end = Dp(0F)) -// .background(color = Color.Black) .size(Dp(24f)) ) + Text( text = text, fontSize = 16.sp, -// color = Color.White, modifier = Modifier -// .background(color = Color.Black) - .align(Alignment.CenterVertically), - + .align(Alignment.CenterVertically) ) } @@ -398,44 +448,96 @@ fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSe } } +@Composable +fun OfferButtons( + offerButton1: Boolean, + offer1: String, + offerButton1Click: () -> Unit, + offerButton2: Boolean, + offer2: String, + offerButton2Click: () -> Unit, + offerButton3: Boolean, + offer3: String, + offerButton3Click: () -> Unit, + offerButton4: Boolean, + offer4: String, + offerButton4Click: () -> Unit, +) { + + Column( modifier = Modifier.padding(top = 16.dp, bottom = 8.dp) ) { + Text(text = "Offer Type", fontSize = 14.sp, fontWeight = FontWeight.Bold, + modifier = Modifier + .width(125.dp) + .height(intrinsicSize = IntrinsicSize.Max) + ) + + Row( modifier = Modifier.fillMaxWidth().padding(top = 12.dp, bottom = 12.dp), horizontalArrangement = Arrangement.SpaceBetween ) { + + ToggleButton( + toggledState = offerButton1, + text = offer1, + onClick = offerButton1Click + ) + ToggleButton( + toggledState = offerButton2, + text = offer2, + onClick = offerButton2Click + ) + ToggleButton( + toggledState = offerButton3, + text = offer3, + onClick = offerButton3Click + ) + ToggleButton( + toggledState = offerButton4, + text = offer4, + onClick = offerButton4Click + ) + } + } +} + @Composable fun AmountField(amount: String, onChange: (text: String) -> Unit){ - Row ( - modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) - ) { - Text(text = "Amount", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + Row( + modifier = Modifier.padding(vertical = 8.dp) + ){ - TextField( - value = amount, - onValueChange = onChange, - placeholder = { Text(text = "0.00") }, - keyboardOptions = KeyboardOptions.Default.copy( - keyboardType = KeyboardType.Number, - imeAction = ImeAction.Done - ), + Text(text = "Amount", fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier - .height(Dp(value = 64F)) - .padding(all = 1.dp) + .width(125.dp) + .height(intrinsicSize = IntrinsicSize.Max) + .align(Alignment.CenterVertically) + ) + + StyledTextField( + value = amount, + onChange = onChange, + placeholder = "US", + keyboardType = KeyboardType.Number ) } + } @Composable fun BuyerCountryField(country: String, onChange: (text: String) -> Unit){ Row ( - modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) + modifier = Modifier.padding(vertical = 9.dp) ) { - Text(text = "Buyer Country", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + Text(text = "Buyer Country", fontSize = 14.sp, fontWeight = FontWeight.Bold, + modifier = Modifier + .width(125.dp) + .height(intrinsicSize = IntrinsicSize.Max) + .align(Alignment.CenterVertically) + ) - TextField( + StyledTextField( value = country, - onValueChange = onChange, - placeholder = { Text(text = "US") }, - modifier = Modifier - .height(Dp(value = 64F)) - .padding(all = 1.dp) + onChange = onChange, + placeholder = "US" ) } @@ -444,125 +546,64 @@ fun BuyerCountryField(country: String, onChange: (text: String) -> Unit){ @Composable fun StageTagField( stageTag: String, onChange: (text: String) -> Unit){ Row ( - modifier = Modifier.height(intrinsicSize = IntrinsicSize.Max) + modifier = Modifier.padding(vertical = 8.dp) ) { - Text(text = "Stage Tag", fontSize = TextUnit(value = 32.0F, type = TextUnitType(type = 1))) + Text(text = "Stage Tag", fontSize = 14.sp, fontWeight = FontWeight.Bold, + modifier = Modifier + .width(125.dp) + .height(intrinsicSize = IntrinsicSize.Max) + .align(Alignment.CenterVertically) + ) - TextField( + StyledTextField( value = stageTag, - onValueChange = onChange, - modifier = Modifier - .height(Dp(value = 64F)) - .padding(all = 1.dp) + onChange = onChange, + placeholder = "US" ) } } @Composable -fun IgnoreCacheSwitch() { - var checked by remember { mutableStateOf(false) } - - Switch( - checked = checked, - onCheckedChange = { - checked = it - Api.ignoreCache = it - } - ) +fun IgnoreCacheSwitch(ignoreCache: Boolean, onChange: (text: Boolean) -> Unit) { + Row { + Switch( + checked = ignoreCache, + onCheckedChange = onChange + ) - Text (text = "Ignore Cache") + Text (text = "Ignore Cache", fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier.align(Alignment.CenterVertically).padding(start = 8.dp)) + } } @Composable -fun DevTouchpointSwitch() { - var checked by remember { mutableStateOf(false) } - - Switch( - checked = checked, - onCheckedChange = { - checked = it - Api.devTouchpoint = it - } - ) +fun DevTouchpointSwitch(devTouchpoint: Boolean, onChange: (text: Boolean) -> Unit) { - Text (text = "Dev Touchpoint") -} - -@Composable -fun OfferButtons(messageView: PayPalMessageView) { - var button1Enabled by remember { mutableStateOf(false) } - var button2Enabled by remember { mutableStateOf(false) } - var button3Enabled by remember { mutableStateOf(false) } - var button4Enabled by remember { mutableStateOf(false) } - - Row() { - ToggleButton( - toggledState = button1Enabled, - text = "Short Term", - onClick = { - messageView.offerType = PayPalMessageOfferType.PAY_LATER_SHORT_TERM - button1Enabled = !button1Enabled - button2Enabled = false - button3Enabled = false - button4Enabled = false - } - ) - ToggleButton( - toggledState = button2Enabled, - text = "Long Term", - - onClick = { - messageView.offerType = PayPalMessageOfferType.PAY_LATER_LONG_TERM - button1Enabled = false - button2Enabled = !button2Enabled - button3Enabled = false - button4Enabled = false - } - ) - ToggleButton( - toggledState = button3Enabled, - text = "Pay in 1", - onClick = { - messageView.offerType = PayPalMessageOfferType.PAY_LATER_PAY_IN_1 - button1Enabled = false - button2Enabled = false - button3Enabled = !button3Enabled - button4Enabled = false - } - ) - ToggleButton( - toggledState = button4Enabled, - text = "Credit", - onClick = { - messageView.offerType = PayPalMessageOfferType.PAYPAL_CREDIT_NO_INTEREST - button1Enabled = false - button2Enabled = false - button3Enabled = false - button4Enabled = !button4Enabled - } + Row{ + Switch( + checked = devTouchpoint, + onCheckedChange = onChange ) + + Text (text = "Dev Touchpoint", fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier.align(Alignment.CenterVertically).padding(start = 8.dp)) } + } @Composable fun ToggleButton( toggledState: Boolean, text: String, onClick: () -> Unit) { Button( -// shape = RoundedCornerShape(8.dp), colors = when(toggledState) { true -> ButtonDefaults.outlinedButtonColors() else -> ButtonDefaults.elevatedButtonColors() }, elevation = ButtonDefaults.elevatedButtonElevation(), + shape = RectangleShape, contentPadding = PaddingValues(start = 6.dp, top = 0.dp, end = 12.dp, bottom = 0.dp), modifier = Modifier + .width(96.dp) .height(IntrinsicSize.Max), -// .border( -// width = 2.dp, // Border width -// color = Color.LightGray, // Border color -//// shape = MaterialTheme.shapes.small -// ), onClick = onClick ) { Text(text) @@ -570,9 +611,11 @@ fun ToggleButton( toggledState: Boolean, text: String, onClick: () -> Unit) { } @Composable -fun FilledButton(onClick: () -> Unit, text: String) { +fun FilledButton(onClick: () -> Unit, text: String, buttonEnabled: Boolean) { var isButtonClicked by remember { mutableStateOf(false) } Button( + modifier = Modifier.width(intrinsicSize = IntrinsicSize.Min), + enabled = buttonEnabled, onClick = { onClick() isButtonClicked = !isButtonClicked @@ -581,3 +624,31 @@ fun FilledButton(onClick: () -> Unit, text: String) { Text(text) } } + +@Composable +fun StyledTextField(value: String, onChange: (text: String) -> Unit, placeholder: String, keyboardType: KeyboardType? = KeyboardType.Text){ + Row( + modifier = Modifier + .fillMaxWidth() + .height(36.dp) + .background( + Color.LightGray, + RectangleShape + ) + ){ + BasicTextField( + value = value, + onValueChange = onChange, + singleLine = true, + textStyle = MaterialTheme.typography.bodyMedium, + keyboardOptions = KeyboardOptions.Default.copy( + keyboardType = keyboardType ?: KeyboardType.Text, + imeAction = ImeAction.Done + ), + modifier = Modifier + .fillMaxWidth() + .fillMaxHeight() + .padding(start = 4.dp, end = 4.dp, top = 8.dp) + ) + } +} From 00a1384890dda2f147a33e2b067c2a1afc35f788 Mon Sep 17 00:00:00 2001 From: grablack Date: Thu, 30 Nov 2023 09:52:10 -0500 Subject: [PATCH 08/22] reset still broken --- .../paypal/messagesdemo/JetpackActivity.kt | 32 ++++++++++++------- 1 file changed, 20 insertions(+), 12 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index b75202c5..95569996 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -97,6 +97,7 @@ class JetpackActivity : ComponentActivity() { var offerButton2 by remember { mutableStateOf(false) } var offerButton3 by remember { mutableStateOf(false) } var offerButton4 by remember { mutableStateOf(false) } + var offerType: PayPalMessageOfferType? by remember { mutableStateOf(null) } var amount: String by remember { mutableStateOf("") } var buyerCountry: String by remember { mutableStateOf("") } @@ -148,15 +149,22 @@ class JetpackActivity : ComponentActivity() { messageView.color = PayPalMessageColor.valueOf(messageColor.uppercase()) messageView.logoType = PayPalMessageLogoType.valueOf(messageLogo.uppercase()) messageView.alignment = PayPalMessageAlign.valueOf((messageAlignment.uppercase())) + messageView.offerType = offerType - messageView.amount = when ( amount.isBlank() ) { - true -> null - false -> amount.toDouble() - } + messageView.amount = amount.let{ + if (it.isBlank()){ + null + } else { + it.toDouble() - messageView.buyerCountry = when( buyerCountry.isBlank() ) { - true -> null - false -> buyerCountry + } + } + messageView.buyerCountry = buyerCountry.let{ + if(it.isBlank()){ + null + }else { + buyerCountry + } } Api.stageTag = stageTag @@ -171,11 +179,11 @@ class JetpackActivity : ComponentActivity() { messageLogo = logoGroupOptions[0] messageAlignment = alignmentGroupOptions[0] - messageView.offerType = null offerButton1 = false offerButton2 = false offerButton3 = false offerButton4 = false + offerType = null amount = "" buyerCountry = "" @@ -236,7 +244,7 @@ class JetpackActivity : ComponentActivity() { offerButton1 = offerButton1, offer1 = "Short Term", offerButton1Click = { - messageView.offerType = PayPalMessageOfferType.PAY_LATER_SHORT_TERM + offerType = PayPalMessageOfferType.PAY_LATER_SHORT_TERM offerButton1 = !offerButton1 offerButton2 = false offerButton3 = false @@ -245,7 +253,7 @@ class JetpackActivity : ComponentActivity() { offerButton2 = offerButton2, offer2 = "Long Term", offerButton2Click = { - messageView.offerType = PayPalMessageOfferType.PAY_LATER_LONG_TERM + offerType = PayPalMessageOfferType.PAY_LATER_LONG_TERM offerButton1 = false offerButton2 = !offerButton2 offerButton3 = false @@ -254,7 +262,7 @@ class JetpackActivity : ComponentActivity() { offerButton3 = offerButton3, offer3 = "Pay in 1", offerButton3Click = { - messageView.offerType = PayPalMessageOfferType.PAY_LATER_PAY_IN_1 + offerType = PayPalMessageOfferType.PAY_LATER_PAY_IN_1 offerButton1 = false offerButton2 = false offerButton3 = !offerButton3 @@ -263,7 +271,7 @@ class JetpackActivity : ComponentActivity() { offerButton4 = offerButton4, offer4 = "Credit", offerButton4Click = { - messageView.offerType = PayPalMessageOfferType.PAYPAL_CREDIT_NO_INTEREST + offerType = PayPalMessageOfferType.PAYPAL_CREDIT_NO_INTEREST offerButton1 = false offerButton2 = false offerButton3 = false From d47df7a282fcaceb429f8ae6ce5217c1be06335c Mon Sep 17 00:00:00 2001 From: grablack Date: Wed, 17 Jan 2024 12:04:31 -0500 Subject: [PATCH 09/22] make offer button match xml demo --- .../paypal/messagesdemo/JetpackActivity.kt | 206 ++++++++---------- 1 file changed, 87 insertions(+), 119 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 95569996..9b56ee48 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -45,12 +45,11 @@ import androidx.compose.ui.text.font.FontWeight fun toSentenceCase(input: String): String { // Convert the string to lowercase and split it into words - val words = input.toLowerCase().split(" ") + val words = input.lowercase().split(" ") // Capitalize the first letter of each word and join them back into a string - val sentenceCase = words.joinToString(" ") { it.capitalize() } + return words.joinToString(" ") { it.replaceFirstChar { it.titlecase() } } - return sentenceCase } class JetpackActivity : ComponentActivity() { @@ -63,7 +62,7 @@ class JetpackActivity : ComponentActivity() { val context = LocalContext.current // Client ID - var clientId: String by remember { mutableStateOf("B_Aksh3K8UpGwAs_Ngi0ahNHJja2bsxqtuqmhRAm944xzM-p6Qkq9JbqFc2yTz2Fg5WYtcW1QEu_tHDVuI") } + var clientId: String by remember { mutableStateOf("") } // Style Color var backgroundColor by remember { mutableStateOf(Color.White) } @@ -90,14 +89,15 @@ class JetpackActivity : ComponentActivity() { toSentenceCase(PayPalMessageAlign.CENTER.name), toSentenceCase(PayPalMessageAlign.RIGHT.name) ) + var messageAlignment by remember { mutableStateOf(alignmentGroupOptions[0])} + val offerGroupOptions = listOf( + "Short Term", "Long Term", "Pay In 1", "Credit" + ) + // Offer Type - var offerButton1 by remember { mutableStateOf(false) } - var offerButton2 by remember { mutableStateOf(false) } - var offerButton3 by remember { mutableStateOf(false) } - var offerButton4 by remember { mutableStateOf(false) } - var offerType: PayPalMessageOfferType? by remember { mutableStateOf(null) } + var offerType: String? by remember { mutableStateOf(null)} var amount: String by remember { mutableStateOf("") } var buyerCountry: String by remember { mutableStateOf("") } @@ -117,7 +117,7 @@ class JetpackActivity : ComponentActivity() { Toast.makeText(this, "Loading Content...", Toast.LENGTH_SHORT).show() }, onError = { - Log.d(TAG, "onError") + Log.d(TAG, "onError $it") // progressBar.visibility = View.INVISIBLE runOnUiThread { buttonEnabled = true @@ -149,7 +149,14 @@ class JetpackActivity : ComponentActivity() { messageView.color = PayPalMessageColor.valueOf(messageColor.uppercase()) messageView.logoType = PayPalMessageLogoType.valueOf(messageLogo.uppercase()) messageView.alignment = PayPalMessageAlign.valueOf((messageAlignment.uppercase())) - messageView.offerType = offerType + + messageView.offerType = when (offerType) { + offerGroupOptions[0] -> PayPalMessageOfferType.PAY_LATER_SHORT_TERM + offerGroupOptions[1] -> PayPalMessageOfferType.PAY_LATER_LONG_TERM + offerGroupOptions[2] -> PayPalMessageOfferType.PAY_LATER_PAY_IN_1 + offerGroupOptions[3] -> PayPalMessageOfferType.PAYPAL_CREDIT_NO_INTEREST + else -> null + } messageView.amount = amount.let{ if (it.isBlank()){ @@ -171,6 +178,9 @@ class JetpackActivity : ComponentActivity() { Api.ignoreCache = ignoreCache Api.devTouchpoint = devTouchpoint + println("messageView.offerType") + println(messageView.offerType) + messageView.refresh() } @@ -179,11 +189,8 @@ class JetpackActivity : ComponentActivity() { messageLogo = logoGroupOptions[0] messageAlignment = alignmentGroupOptions[0] - offerButton1 = false - offerButton2 = false - offerButton3 = false - offerButton4 = false offerType = null + messageView.data.offerType = null amount = "" buyerCountry = "" @@ -195,7 +202,9 @@ class JetpackActivity : ComponentActivity() { } // A surface container using the 'background' color from the theme - Surface(modifier = Modifier.fillMaxSize().padding(start = 12.dp, end = 12.dp), color = MaterialTheme.colorScheme.background) { + Surface(modifier = Modifier + .fillMaxSize() + .padding(start = 12.dp, end = 12.dp), color = MaterialTheme.colorScheme.background) { Column ( modifier = Modifier.verticalScroll(state = rememberScrollState()) ){ @@ -240,45 +249,29 @@ class JetpackActivity : ComponentActivity() { } ) - OfferButtons( - offerButton1 = offerButton1, - offer1 = "Short Term", - offerButton1Click = { - offerType = PayPalMessageOfferType.PAY_LATER_SHORT_TERM - offerButton1 = !offerButton1 - offerButton2 = false - offerButton3 = false - offerButton4 = false - }, - offerButton2 = offerButton2, - offer2 = "Long Term", - offerButton2Click = { - offerType = PayPalMessageOfferType.PAY_LATER_LONG_TERM - offerButton1 = false - offerButton2 = !offerButton2 - offerButton3 = false - offerButton4 = false - }, - offerButton3 = offerButton3, - offer3 = "Pay in 1", - offerButton3Click = { - offerType = PayPalMessageOfferType.PAY_LATER_PAY_IN_1 - offerButton1 = false - offerButton2 = false - offerButton3 = !offerButton3 - offerButton4 = false - }, - offerButton4 = offerButton4, - offer4 = "Credit", - offerButton4Click = { - offerType = PayPalMessageOfferType.PAYPAL_CREDIT_NO_INTEREST - offerButton1 = false - offerButton2 = false - offerButton3 = false - offerButton4 = !offerButton4 + Row ( + horizontalArrangement = Arrangement.SpaceBetween, + modifier = Modifier.fillMaxWidth() + ){ + Text(text = "Offer Type", fontSize = 14.sp, fontWeight = FontWeight.Bold, + modifier = Modifier + .padding(top = 8.dp) + .width(125.dp) + .height(intrinsicSize = IntrinsicSize.Max) + ) + } + + OfferOptions( + offerGroupOptions = offerGroupOptions, + selected = offerType, + onSelected = { text: String -> + offerType = text } ) + FilledButton(text = "Clear", onClick = { offerType = null }, buttonEnabled = buttonEnabled) + + AmountField( amount = amount, onChange = { amount = it } @@ -293,7 +286,9 @@ class JetpackActivity : ComponentActivity() { Row ( horizontalArrangement = Arrangement.SpaceBetween, - modifier = Modifier.fillMaxWidth().padding(vertical = 8.dp) + modifier = Modifier + .fillMaxWidth() + .padding(vertical = 8.dp) ){ IgnoreCacheSwitch(ignoreCache = ignoreCache, onChange = { ignoreCache = it }) DevTouchpointSwitch(devTouchpoint = devTouchpoint, onChange = { devTouchpoint = it }) @@ -373,7 +368,7 @@ fun LogoOptions( logoGroupOptions: List, selected: String, onSelected: ( ) Text( text = text, - fontSize = 16.sp, + fontSize = 14.sp, modifier = Modifier .align(Alignment.CenterVertically) ) @@ -446,7 +441,7 @@ fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSe Text( text = text, - fontSize = 16.sp, + fontSize = 14.sp, modifier = Modifier .align(Alignment.CenterVertically) ) @@ -457,50 +452,39 @@ fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSe } @Composable -fun OfferButtons( - offerButton1: Boolean, - offer1: String, - offerButton1Click: () -> Unit, - offerButton2: Boolean, - offer2: String, - offerButton2Click: () -> Unit, - offerButton3: Boolean, - offer3: String, - offerButton3Click: () -> Unit, - offerButton4: Boolean, - offer4: String, - offerButton4Click: () -> Unit, -) { - - Column( modifier = Modifier.padding(top = 16.dp, bottom = 8.dp) ) { - Text(text = "Offer Type", fontSize = 14.sp, fontWeight = FontWeight.Bold, - modifier = Modifier - .width(125.dp) - .height(intrinsicSize = IntrinsicSize.Max) - ) +fun OfferOptions(offerGroupOptions: List, selected: String?, onSelected: (text: String) -> Unit) { - Row( modifier = Modifier.fillMaxWidth().padding(top = 12.dp, bottom = 12.dp), horizontalArrangement = Arrangement.SpaceBetween ) { + Row ( + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(vertical = 4.dp) + ) { + + offerGroupOptions.forEach { text -> + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelected(text) } + ), + ) { + RadioButton ( + selected = (text == selected), + onClick = { onSelected(text) }, + modifier = Modifier + .padding(end = Dp(0F)) + .size(Dp(24f)) + ) + + Text( + text = text, + fontSize = 14.sp, + modifier = Modifier + .align(Alignment.CenterVertically) + ) + } - ToggleButton( - toggledState = offerButton1, - text = offer1, - onClick = offerButton1Click - ) - ToggleButton( - toggledState = offerButton2, - text = offer2, - onClick = offerButton2Click - ) - ToggleButton( - toggledState = offerButton3, - text = offer3, - onClick = offerButton3Click - ) - ToggleButton( - toggledState = offerButton4, - text = offer4, - onClick = offerButton4Click - ) } } } @@ -580,7 +564,9 @@ fun IgnoreCacheSwitch(ignoreCache: Boolean, onChange: (text: Boolean) -> Unit) { onCheckedChange = onChange ) - Text (text = "Ignore Cache", fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier.align(Alignment.CenterVertically).padding(start = 8.dp)) + Text (text = "Ignore Cache", fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier + .align(Alignment.CenterVertically) + .padding(start = 8.dp)) } } @@ -593,31 +579,13 @@ fun DevTouchpointSwitch(devTouchpoint: Boolean, onChange: (text: Boolean) -> Uni onCheckedChange = onChange ) - Text (text = "Dev Touchpoint", fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier.align(Alignment.CenterVertically).padding(start = 8.dp)) + Text (text = "Dev Touchpoint", fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier + .align(Alignment.CenterVertically) + .padding(start = 8.dp)) } } -@Composable -fun ToggleButton( toggledState: Boolean, text: String, onClick: () -> Unit) { - - Button( - colors = when(toggledState) { - true -> ButtonDefaults.outlinedButtonColors() - else -> ButtonDefaults.elevatedButtonColors() - }, - elevation = ButtonDefaults.elevatedButtonElevation(), - shape = RectangleShape, - contentPadding = PaddingValues(start = 6.dp, top = 0.dp, end = 12.dp, bottom = 0.dp), - modifier = Modifier - .width(96.dp) - .height(IntrinsicSize.Max), - onClick = onClick - ) { - Text(text) - } -} - @Composable fun FilledButton(onClick: () -> Unit, text: String, buttonEnabled: Boolean) { var isButtonClicked by remember { mutableStateOf(false) } From c422efc138cce08b14ce8d50058558a606506698 Mon Sep 17 00:00:00 2001 From: grablack Date: Wed, 17 Jan 2024 12:20:18 -0500 Subject: [PATCH 10/22] progressbar --- .../paypal/messagesdemo/JetpackActivity.kt | 23 ++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 9b56ee48..7f009acc 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -61,6 +61,8 @@ class JetpackActivity : ComponentActivity() { BasicTheme { val context = LocalContext.current + var progessBar by remember{ mutableStateOf(false) } + // Client ID var clientId: String by remember { mutableStateOf("") } @@ -112,13 +114,13 @@ class JetpackActivity : ComponentActivity() { data = PayPalMessageData(clientID = clientId, environment = PayPalEnvironment.SANDBOX), viewStateCallbacks = PayPalMessageViewStateCallbacks( onLoading = { -// progressBar.visibility = View.VISIBLE + progessBar = true buttonEnabled = false Toast.makeText(this, "Loading Content...", Toast.LENGTH_SHORT).show() }, onError = { Log.d(TAG, "onError $it") -// progressBar.visibility = View.INVISIBLE + progessBar = false runOnUiThread { buttonEnabled = true Toast.makeText(this, it.javaClass.toString() + ":" + it.message, Toast.LENGTH_LONG).show() @@ -126,7 +128,7 @@ class JetpackActivity : ComponentActivity() { }, onSuccess = { Log.d(TAG, "onSuccess") -// progressBar.visibility = View.INVISIBLE + progessBar = false runOnUiThread { buttonEnabled = true Toast.makeText(this, "Success Getting Content", Toast.LENGTH_SHORT).show() @@ -294,6 +296,8 @@ class JetpackActivity : ComponentActivity() { DevTouchpointSwitch(devTouchpoint = devTouchpoint, onChange = { devTouchpoint = it }) } + CircularIndicator(progressBar = progessBar) + AndroidView( modifier = Modifier .padding(top = 16.dp, bottom = 32.dp, start = 8.dp, end = 8.dp) @@ -628,3 +632,16 @@ fun StyledTextField(value: String, onChange: (text: String) -> Unit, placeholder ) } } + +@Composable +fun CircularIndicator(progressBar: Boolean) { + if (!progressBar) return + + CircularProgressIndicator( + modifier = Modifier + .width(32.dp), + color = MaterialTheme.colorScheme.secondary, + trackColor = MaterialTheme.colorScheme.surfaceVariant, + ) + +} From 3a7fb65945ca4fde48624c021f82a8291ac7ebb7 Mon Sep 17 00:00:00 2001 From: grablack Date: Thu, 18 Jan 2024 17:09:24 -0500 Subject: [PATCH 11/22] most of the linting --- .../paypal/messagesdemo/JetpackActivity.kt | 348 +++++++++--------- 1 file changed, 184 insertions(+), 164 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 7f009acc..06c8f656 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -5,7 +5,6 @@ import android.os.Bundle import android.util.Log import androidx.activity.ComponentActivity import androidx.activity.compose.setContent -import androidx.compose.foundation.layout.* import androidx.compose.ui.Modifier import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.viewinterop.AndroidView @@ -15,41 +14,57 @@ import com.paypal.messages.config.message.style.PayPalMessageColor import com.paypal.messages.config.message.style.PayPalMessageLogoType import com.paypal.messagesdemo.ui.BasicTheme import android.widget.Toast -import androidx.compose.foundation.* -import androidx.compose.material3.* +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Arrangement import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.IntrinsicSize import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxHeight +import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.layout.width +import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.selection.selectable import androidx.compose.foundation.text.BasicTextField import androidx.compose.foundation.text.KeyboardOptions +import androidx.compose.foundation.verticalScroll +import androidx.compose.material3.Button +import androidx.compose.material3.CircularProgressIndicator +import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.RadioButton +import androidx.compose.material3.Surface +import androidx.compose.material3.Switch +import androidx.compose.material3.Text import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.RectangleShape +import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.input.ImeAction import androidx.compose.ui.text.input.KeyboardType -import androidx.compose.ui.unit.* +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp import com.paypal.messages.config.PayPalMessageOfferType -import com.paypal.messages.config.message.* +import com.paypal.messages.config.message.PayPalMessageConfig +import com.paypal.messages.config.message.PayPalMessageData +import com.paypal.messages.config.message.PayPalMessageViewStateCallbacks import com.paypal.messages.config.message.style.PayPalMessageAlign import com.paypal.messages.io.Api -import androidx.compose.ui.unit.dp -import androidx.compose.ui.text.font.FontWeight fun toSentenceCase(input: String): String { // Convert the string to lowercase and split it into words val words = input.lowercase().split(" ") // Capitalize the first letter of each word and join them back into a string - return words.joinToString(" ") { it.replaceFirstChar { it.titlecase() } } - + return words.joinToString(" ") { it -> it.replaceFirstChar { it.titlecase() } } } class JetpackActivity : ComponentActivity() { @@ -61,10 +76,8 @@ class JetpackActivity : ComponentActivity() { BasicTheme { val context = LocalContext.current - var progessBar by remember{ mutableStateOf(false) } - - // Client ID - var clientId: String by remember { mutableStateOf("") } + var progessBar by remember { mutableStateOf(false) } + var clientId: String by remember { mutableStateOf("CLIENT_ID_HERE") } // Style Color var backgroundColor by remember { mutableStateOf(Color.White) } @@ -72,44 +85,44 @@ class JetpackActivity : ComponentActivity() { toSentenceCase(PayPalMessageColor.BLACK.name), toSentenceCase(PayPalMessageColor.WHITE.name), toSentenceCase(PayPalMessageColor.MONOCHROME.name), - toSentenceCase(PayPalMessageColor.GRAYSCALE.name) + toSentenceCase(PayPalMessageColor.GRAYSCALE.name), ) - var messageColor by remember { mutableStateOf(colorGroupOptions[0])} + var messageColor by remember { mutableStateOf(colorGroupOptions[0]) } // Style Logo val logoGroupOptions = listOf( toSentenceCase(PayPalMessageLogoType.PRIMARY.name), toSentenceCase(PayPalMessageLogoType.INLINE.name), toSentenceCase(PayPalMessageLogoType.ALTERNATIVE.name), - toSentenceCase(PayPalMessageLogoType.NONE.name) + toSentenceCase(PayPalMessageLogoType.NONE.name), ) - var messageLogo by remember { mutableStateOf(logoGroupOptions[0])} + var messageLogo by remember { mutableStateOf(logoGroupOptions[0]) } // Style Aligntment val alignmentGroupOptions = listOf( toSentenceCase(PayPalMessageAlign.LEFT.name), toSentenceCase(PayPalMessageAlign.CENTER.name), - toSentenceCase(PayPalMessageAlign.RIGHT.name) + toSentenceCase(PayPalMessageAlign.RIGHT.name), ) - - var messageAlignment by remember { mutableStateOf(alignmentGroupOptions[0])} + var messageAlignment by remember { mutableStateOf(alignmentGroupOptions[0]) } val offerGroupOptions = listOf( - "Short Term", "Long Term", "Pay In 1", "Credit" + "Short Term", + "Long Term", + "Pay In 1", + "Credit", ) - - // Offer Type - var offerType: String? by remember { mutableStateOf(null)} + var offerType: String? by remember { mutableStateOf(null) } var amount: String by remember { mutableStateOf("") } - var buyerCountry: String by remember { mutableStateOf("") } + var buyerCountry: String by remember { mutableStateOf("") } var stageTag: String by remember { mutableStateOf("") } var ignoreCache: Boolean by remember { mutableStateOf(false) } var devTouchpoint: Boolean by remember { mutableStateOf(false) } - var buttonEnabled: Boolean by remember { mutableStateOf(true) } - val messageView = PayPalMessageView(context, + val messageView = PayPalMessageView( + context, config = PayPalMessageConfig( data = PayPalMessageData(clientID = clientId, environment = PayPalEnvironment.SANDBOX), viewStateCallbacks = PayPalMessageViewStateCallbacks( @@ -134,15 +147,14 @@ class JetpackActivity : ComponentActivity() { Toast.makeText(this, "Success Getting Content", Toast.LENGTH_SHORT).show() } }, - ) - ) + ), + ), ) fun updateMessageData() { + messageView.clientID = clientId - messageView.clientId = clientId - - if ( PayPalMessageColor.valueOf(messageColor.uppercase()) === PayPalMessageColor.WHITE ) { + if (PayPalMessageColor.valueOf(messageColor.uppercase()) === PayPalMessageColor.WHITE) { backgroundColor = Color.Black } else { backgroundColor = Color.White @@ -160,18 +172,17 @@ class JetpackActivity : ComponentActivity() { else -> null } - messageView.amount = amount.let{ - if (it.isBlank()){ + messageView.amount = amount.let { + if (it.isBlank()) { null } else { it.toDouble() - } } - messageView.buyerCountry = buyerCountry.let{ - if(it.isBlank()){ + messageView.buyerCountry = buyerCountry.let { + if (it.isBlank()) { null - }else { + } else { buyerCountry } } @@ -180,9 +191,6 @@ class JetpackActivity : ComponentActivity() { Api.ignoreCache = ignoreCache Api.devTouchpoint = devTouchpoint - println("messageView.offerType") - println(messageView.offerType) - messageView.refresh() } @@ -204,62 +212,75 @@ class JetpackActivity : ComponentActivity() { } // A surface container using the 'background' color from the theme - Surface(modifier = Modifier - .fillMaxSize() - .padding(start = 12.dp, end = 12.dp), color = MaterialTheme.colorScheme.background) { - Column ( - modifier = Modifier.verticalScroll(state = rememberScrollState()) - ){ - - Text(text = "Message Configuration", fontSize = 20.sp, fontWeight = FontWeight.Bold, modifier = Modifier.padding(top = 8.dp)) + Surface( + color = MaterialTheme.colorScheme.background, + modifier = Modifier + .fillMaxSize() + .padding(start = 12.dp, end = 12.dp), + ) { + Column( + modifier = Modifier.verticalScroll(state = rememberScrollState()), + ) { + Text( + text = "Message Configuration", + fontSize = 20.sp, + fontWeight = FontWeight.Bold, + modifier = Modifier.padding(top = 8.dp), + ) ClientIdField( text = "Client ID", clientId = clientId, onChange = { clientId = it - } + }, ) - Text(text = "Style Options", fontSize = 14.sp, fontWeight = FontWeight.Bold, + Text( + text = "Style Options", + fontSize = 14.sp, + fontWeight = FontWeight.Bold, modifier = Modifier .width(125.dp) - .height(intrinsicSize = IntrinsicSize.Max) + .height(intrinsicSize = IntrinsicSize.Max), ) LogoOptions( logoGroupOptions = logoGroupOptions, selected = messageLogo, onSelected = { text: String -> - messageLogo = text.toString() - } + messageLogo = text + }, ) ColorOptions( colorGroupOptions = colorGroupOptions, selected = messageColor, onSelected = { text: String -> - messageColor = text.toString() - } + messageColor = text + }, ) AlignmentOptions( alignmentGroupOptions = alignmentGroupOptions, selected = messageAlignment, onSelected = { text: String -> - messageAlignment = text.toString() - } + messageAlignment = text + }, ) - Row ( + Row( horizontalArrangement = Arrangement.SpaceBetween, - modifier = Modifier.fillMaxWidth() - ){ - Text(text = "Offer Type", fontSize = 14.sp, fontWeight = FontWeight.Bold, + modifier = Modifier.fillMaxWidth(), + ) { + Text( + text = "Offer Type", + fontSize = 14.sp, + fontWeight = FontWeight.Bold, modifier = Modifier .padding(top = 8.dp) .width(125.dp) - .height(intrinsicSize = IntrinsicSize.Max) + .height(intrinsicSize = IntrinsicSize.Max), ) } @@ -268,30 +289,29 @@ class JetpackActivity : ComponentActivity() { selected = offerType, onSelected = { text: String -> offerType = text - } + }, ) FilledButton(text = "Clear", onClick = { offerType = null }, buttonEnabled = buttonEnabled) - AmountField( amount = amount, - onChange = { amount = it } + onChange = { amount = it }, ) BuyerCountryField( country = buyerCountry, - onChange = { buyerCountry = it } + onChange = { buyerCountry = it }, ) StageTagField(stageTag, onChange = { stageTag = it }) - Row ( + Row( horizontalArrangement = Arrangement.SpaceBetween, modifier = Modifier .fillMaxWidth() - .padding(vertical = 8.dp) - ){ + .padding(vertical = 8.dp), + ) { IgnoreCacheSwitch(ignoreCache = ignoreCache, onChange = { ignoreCache = it }) DevTouchpointSwitch(devTouchpoint = devTouchpoint, onChange = { devTouchpoint = it }) } @@ -303,19 +323,18 @@ class JetpackActivity : ComponentActivity() { .padding(top = 16.dp, bottom = 32.dp, start = 8.dp, end = 8.dp) .background(color = backgroundColor) .fillMaxWidth(), - factory = { _ -> + factory = { messageView - } + }, ) - Row ( + Row( horizontalArrangement = Arrangement.SpaceBetween, - modifier = Modifier.fillMaxWidth() - ){ + modifier = Modifier.fillMaxWidth(), + ) { FilledButton(text = "Reset", onClick = { resetButton() }, buttonEnabled = buttonEnabled) FilledButton(text = "Submit", onClick = { updateMessageData() }, buttonEnabled = buttonEnabled) } - } } } @@ -325,56 +344,54 @@ class JetpackActivity : ComponentActivity() { @Composable fun ClientIdField(clientId: String, onChange: (text: String) -> Unit, text: String) { - Row ( - modifier = Modifier.padding(vertical = 16.dp) + Row( + modifier = Modifier.padding(vertical = 16.dp), ) { - Text(text = text, fontSize = 14.sp, fontWeight = FontWeight.Bold, + Text( + text = text, + fontSize = 14.sp, + fontWeight = FontWeight.Bold, modifier = Modifier .width(125.dp) .height(intrinsicSize = IntrinsicSize.Max) - .align(Alignment.CenterVertically) + .align(Alignment.CenterVertically), ) StyledTextField( value = clientId, onChange = onChange, - placeholder = text ) - } } @Composable -fun LogoOptions( logoGroupOptions: List, selected: String, onSelected: (text: String) -> Unit ) { - val radioGroupOptions = logoGroupOptions - - Row ( +fun LogoOptions(logoGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { + Row( horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(top = 8.dp) + modifier = Modifier.padding(top = 8.dp), ) { - radioGroupOptions.forEach { text -> - + logoGroupOptions.forEach { text -> Row( modifier = Modifier .height(intrinsicSize = IntrinsicSize.Max) .padding(end = Dp(8.0F)) .selectable( selected = (text == selected), - onClick = { onSelected(text) } + onClick = { onSelected(text) }, ), ) { - RadioButton ( + RadioButton( selected = (text == selected), onClick = { onSelected(text) }, modifier = Modifier .padding(end = Dp(0F)) - .size(Dp(24f)) + .size(Dp(24f)), ) Text( text = text, fontSize = 14.sp, modifier = Modifier - .align(Alignment.CenterVertically) + .align(Alignment.CenterVertically), ) } } @@ -383,34 +400,32 @@ fun LogoOptions( logoGroupOptions: List, selected: String, onSelected: ( @Composable fun ColorOptions(colorGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { - - Row ( + Row( horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(vertical = 4.dp) + modifier = Modifier.padding(vertical = 4.dp), ) { colorGroupOptions.forEach { text -> - Row( modifier = Modifier .height(intrinsicSize = IntrinsicSize.Max) .padding(end = Dp(8.0F)) .selectable( selected = (text == selected), - onClick = { onSelected(text) } + onClick = { onSelected(text) }, ), ) { - RadioButton ( + RadioButton( selected = (text == selected), onClick = { onSelected(text) }, modifier = Modifier .padding(end = Dp(0F)) - .size(Dp(24f)) + .size(Dp(24f)), ) Text( text = text, fontSize = 14.sp, modifier = Modifier - .align(Alignment.CenterVertically) + .align(Alignment.CenterVertically), ) } } @@ -419,12 +434,10 @@ fun ColorOptions(colorGroupOptions: List, selected: String, onSelected: @Composable fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { - - Row ( + Row( horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(vertical = 4.dp) + modifier = Modifier.padding(vertical = 4.dp), ) { - alignmentGroupOptions.forEach { text -> Row( modifier = Modifier @@ -432,37 +445,34 @@ fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSe .padding(end = Dp(8.0F)) .selectable( selected = (text == selected), - onClick = { onSelected(text) } + onClick = { onSelected(text) }, ), ) { - RadioButton ( + RadioButton( selected = (text == selected), onClick = { onSelected(text) }, modifier = Modifier .padding(end = Dp(0F)) - .size(Dp(24f)) + .size(Dp(24f)), ) Text( text = text, fontSize = 14.sp, modifier = Modifier - .align(Alignment.CenterVertically) - ) + .align(Alignment.CenterVertically), + ) } - } } } @Composable fun OfferOptions(offerGroupOptions: List, selected: String?, onSelected: (text: String) -> Unit) { - - Row ( + Row( horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(vertical = 4.dp) + modifier = Modifier.padding(vertical = 4.dp), ) { - offerGroupOptions.forEach { text -> Row( modifier = Modifier @@ -470,93 +480,92 @@ fun OfferOptions(offerGroupOptions: List, selected: String?, onSelected: .padding(end = Dp(8.0F)) .selectable( selected = (text == selected), - onClick = { onSelected(text) } + onClick = { onSelected(text) }, ), ) { - RadioButton ( + RadioButton( selected = (text == selected), onClick = { onSelected(text) }, modifier = Modifier .padding(end = Dp(0F)) - .size(Dp(24f)) + .size(Dp(24f)), ) Text( text = text, fontSize = 14.sp, modifier = Modifier - .align(Alignment.CenterVertically) + .align(Alignment.CenterVertically), ) } - } } } @Composable -fun AmountField(amount: String, onChange: (text: String) -> Unit){ - +fun AmountField(amount: String, onChange: (text: String) -> Unit) { Row( - modifier = Modifier.padding(vertical = 8.dp) - ){ - - Text(text = "Amount", fontSize = 14.sp, fontWeight = FontWeight.Bold, + modifier = Modifier.padding(vertical = 8.dp), + ) { + Text( + text = "Amount", + fontSize = 14.sp, + fontWeight = FontWeight.Bold, modifier = Modifier .width(125.dp) .height(intrinsicSize = IntrinsicSize.Max) - .align(Alignment.CenterVertically) + .align(Alignment.CenterVertically), ) StyledTextField( value = amount, onChange = onChange, - placeholder = "US", - keyboardType = KeyboardType.Number + keyboardType = KeyboardType.Number, ) - } - } @Composable -fun BuyerCountryField(country: String, onChange: (text: String) -> Unit){ - Row ( - modifier = Modifier.padding(vertical = 9.dp) +fun BuyerCountryField(country: String, onChange: (text: String) -> Unit) { + Row( + modifier = Modifier.padding(vertical = 9.dp), ) { - Text(text = "Buyer Country", fontSize = 14.sp, fontWeight = FontWeight.Bold, + Text( + text = "Buyer Country", + fontSize = 14.sp, + fontWeight = FontWeight.Bold, modifier = Modifier .width(125.dp) .height(intrinsicSize = IntrinsicSize.Max) - .align(Alignment.CenterVertically) + .align(Alignment.CenterVertically), ) StyledTextField( value = country, onChange = onChange, - placeholder = "US" ) - } } @Composable -fun StageTagField( stageTag: String, onChange: (text: String) -> Unit){ - Row ( - modifier = Modifier.padding(vertical = 8.dp) +fun StageTagField(stageTag: String, onChange: (text: String) -> Unit) { + Row( + modifier = Modifier.padding(vertical = 8.dp), ) { - Text(text = "Stage Tag", fontSize = 14.sp, fontWeight = FontWeight.Bold, + Text( + text = "Stage Tag", + fontSize = 14.sp, + fontWeight = FontWeight.Bold, modifier = Modifier .width(125.dp) .height(intrinsicSize = IntrinsicSize.Max) - .align(Alignment.CenterVertically) + .align(Alignment.CenterVertically), ) StyledTextField( value = stageTag, onChange = onChange, - placeholder = "US" ) - } } @@ -565,29 +574,37 @@ fun IgnoreCacheSwitch(ignoreCache: Boolean, onChange: (text: Boolean) -> Unit) { Row { Switch( checked = ignoreCache, - onCheckedChange = onChange + onCheckedChange = onChange, ) - Text (text = "Ignore Cache", fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier - .align(Alignment.CenterVertically) - .padding(start = 8.dp)) + Text( + text = "Ignore Cache", + fontSize = 14.sp, + fontWeight = FontWeight.Bold, + modifier = Modifier + .align(Alignment.CenterVertically) + .padding(start = 8.dp), + ) } } @Composable fun DevTouchpointSwitch(devTouchpoint: Boolean, onChange: (text: Boolean) -> Unit) { - - Row{ + Row { Switch( checked = devTouchpoint, - onCheckedChange = onChange + onCheckedChange = onChange, ) - Text (text = "Dev Touchpoint", fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier - .align(Alignment.CenterVertically) - .padding(start = 8.dp)) + Text( + text = "Dev Touchpoint", + fontSize = 14.sp, + fontWeight = FontWeight.Bold, + modifier = Modifier + .align(Alignment.CenterVertically) + .padding(start = 8.dp), + ) } - } @Composable @@ -606,29 +623,33 @@ fun FilledButton(onClick: () -> Unit, text: String, buttonEnabled: Boolean) { } @Composable -fun StyledTextField(value: String, onChange: (text: String) -> Unit, placeholder: String, keyboardType: KeyboardType? = KeyboardType.Text){ +fun StyledTextField( + value: String, + onChange: (text: String) -> Unit, + keyboardType: KeyboardType? = KeyboardType.Text, +) { Row( modifier = Modifier .fillMaxWidth() .height(36.dp) .background( Color.LightGray, - RectangleShape - ) - ){ + RectangleShape, + ), + ) { BasicTextField( value = value, onValueChange = onChange, singleLine = true, - textStyle = MaterialTheme.typography.bodyMedium, + textStyle = MaterialTheme.typography.bodyMedium, keyboardOptions = KeyboardOptions.Default.copy( keyboardType = keyboardType ?: KeyboardType.Text, - imeAction = ImeAction.Done + imeAction = ImeAction.Done, ), modifier = Modifier .fillMaxWidth() .fillMaxHeight() - .padding(start = 4.dp, end = 4.dp, top = 8.dp) + .padding(start = 4.dp, end = 4.dp, top = 8.dp), ) } } @@ -643,5 +664,4 @@ fun CircularIndicator(progressBar: Boolean) { color = MaterialTheme.colorScheme.secondary, trackColor = MaterialTheme.colorScheme.surfaceVariant, ) - } From 7ef62dfc3d63b0eff62fe2ffcb7d7cfbb01301ea Mon Sep 17 00:00:00 2001 From: grablack Date: Mon, 22 Jan 2024 09:54:48 -0500 Subject: [PATCH 12/22] Lexicographic order --- .../paypal/messagesdemo/JetpackActivity.kt | 24 +++++++++---------- 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 06c8f656..bfe3c63b 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -3,21 +3,11 @@ package com.paypal.messagesdemo import android.content.ContentValues.TAG import android.os.Bundle import android.util.Log +import android.widget.Toast import androidx.activity.ComponentActivity import androidx.activity.compose.setContent -import androidx.compose.ui.Modifier -import androidx.compose.ui.platform.LocalContext -import androidx.compose.ui.viewinterop.AndroidView -import com.paypal.messages.PayPalMessageView -import com.paypal.messages.config.PayPalEnvironment -import com.paypal.messages.config.message.style.PayPalMessageColor -import com.paypal.messages.config.message.style.PayPalMessageLogoType -import com.paypal.messagesdemo.ui.BasicTheme -import android.widget.Toast import androidx.compose.foundation.background import androidx.compose.foundation.layout.Arrangement -import androidx.compose.runtime.Composable -import androidx.compose.runtime.getValue import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.IntrinsicSize import androidx.compose.foundation.layout.Row @@ -40,24 +30,34 @@ import androidx.compose.material3.RadioButton import androidx.compose.material3.Surface import androidx.compose.material3.Switch import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.RectangleShape +import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.input.ImeAction import androidx.compose.ui.text.input.KeyboardType import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp +import androidx.compose.ui.viewinterop.AndroidView +import com.paypal.messages.PayPalMessageView +import com.paypal.messages.config.PayPalEnvironment import com.paypal.messages.config.PayPalMessageOfferType import com.paypal.messages.config.message.PayPalMessageConfig import com.paypal.messages.config.message.PayPalMessageData import com.paypal.messages.config.message.PayPalMessageViewStateCallbacks import com.paypal.messages.config.message.style.PayPalMessageAlign +import com.paypal.messages.config.message.style.PayPalMessageColor +import com.paypal.messages.config.message.style.PayPalMessageLogoType import com.paypal.messages.io.Api +import com.paypal.messagesdemo.ui.BasicTheme fun toSentenceCase(input: String): String { // Convert the string to lowercase and split it into words @@ -98,7 +98,7 @@ class JetpackActivity : ComponentActivity() { ) var messageLogo by remember { mutableStateOf(logoGroupOptions[0]) } - // Style Aligntment + // Style Alignment val alignmentGroupOptions = listOf( toSentenceCase(PayPalMessageAlign.LEFT.name), toSentenceCase(PayPalMessageAlign.CENTER.name), From aa223f47fc3c7d97cc46e45be02603a87dad084b Mon Sep 17 00:00:00 2001 From: grablack Date: Wed, 24 Jan 2024 10:43:32 -0500 Subject: [PATCH 13/22] restore --- .../main/res/layout/paypal_message_view.xml | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/library/src/main/res/layout/paypal_message_view.xml b/library/src/main/res/layout/paypal_message_view.xml index e63a2f03..f2efa49b 100644 --- a/library/src/main/res/layout/paypal_message_view.xml +++ b/library/src/main/res/layout/paypal_message_view.xml @@ -1,12 +1,17 @@ - + android:layout_height="match_parent" + xmlns:tools="http://schemas.android.com/tools" + xmlns:app="http://schemas.android.com/apk/res-auto"> - + android:layout_width="0dp" + android:layout_height="0dp" + tools:text="Message" + app:layout_constraintTop_toTopOf="parent" + app:layout_constraintStart_toStartOf="parent" + app:layout_constraintEnd_toEndOf="parent" + app:layout_constraintBottom_toBottomOf="parent"/> + \ No newline at end of file From d0d692573331ec97c5d4ebc42dd31c1fba48cbf8 Mon Sep 17 00:00:00 2001 From: grablack Date: Wed, 24 Jan 2024 10:47:48 -0500 Subject: [PATCH 14/22] new line --- library/src/main/res/layout/paypal_message_view.xml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/library/src/main/res/layout/paypal_message_view.xml b/library/src/main/res/layout/paypal_message_view.xml index f2efa49b..a69f939e 100644 --- a/library/src/main/res/layout/paypal_message_view.xml +++ b/library/src/main/res/layout/paypal_message_view.xml @@ -14,4 +14,4 @@ app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintBottom_toBottomOf="parent"/> - \ No newline at end of file + From 584d587a99e871344efd3e8f4549f0914b0df610 Mon Sep 17 00:00:00 2001 From: grablack Date: Wed, 24 Jan 2024 10:49:06 -0500 Subject: [PATCH 15/22] slight reordering --- demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index bfe3c63b..563f5066 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -76,7 +76,6 @@ class JetpackActivity : ComponentActivity() { BasicTheme { val context = LocalContext.current - var progessBar by remember { mutableStateOf(false) } var clientId: String by remember { mutableStateOf("CLIENT_ID_HERE") } // Style Color @@ -121,6 +120,8 @@ class JetpackActivity : ComponentActivity() { var devTouchpoint: Boolean by remember { mutableStateOf(false) } var buttonEnabled: Boolean by remember { mutableStateOf(true) } + var progessBar by remember { mutableStateOf(false) } + val messageView = PayPalMessageView( context, config = PayPalMessageConfig( From 1a8bb98665a61bb3d4c3bbd7e85c22c0e0cfc7b6 Mon Sep 17 00:00:00 2001 From: grablack Date: Wed, 7 Feb 2024 16:42:00 -0500 Subject: [PATCH 16/22] move composables --- .../paypal/messagesdemo/JetpackActivity.kt | 362 +----------------- .../composables/AlignmentOptions.kt | 52 +++ .../composables/CircularIndicator.kt | 20 + .../messagesdemo/composables/ColorOptions.kt | 51 +++ .../composables/DevTouchpointSwitch.kt | 31 ++ .../messagesdemo/composables/FilledButton.kt | 28 ++ .../composables/IgnoreCacheSwitch.kt | 31 ++ .../messagesdemo/composables/InputField.kt | 40 ++ .../messagesdemo/composables/LogoOptions.kt | 51 +++ .../messagesdemo/composables/OfferOptions.kt | 52 +++ .../composables/StyledTextField.kt | 50 +++ 11 files changed, 424 insertions(+), 344 deletions(-) create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/AlignmentOptions.kt create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/CircularIndicator.kt create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/ColorOptions.kt create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/DevTouchpointSwitch.kt create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/FilledButton.kt create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/IgnoreCacheSwitch.kt create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/InputField.kt create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/LogoOptions.kt create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/OfferOptions.kt create mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/StyledTextField.kt diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 563f5066..1421de34 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -16,34 +16,21 @@ import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.width import androidx.compose.foundation.rememberScrollState -import androidx.compose.foundation.selection.selectable -import androidx.compose.foundation.text.BasicTextField -import androidx.compose.foundation.text.KeyboardOptions import androidx.compose.foundation.verticalScroll -import androidx.compose.material3.Button -import androidx.compose.material3.CircularProgressIndicator import androidx.compose.material3.MaterialTheme -import androidx.compose.material3.RadioButton import androidx.compose.material3.Surface -import androidx.compose.material3.Switch import androidx.compose.material3.Text -import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue -import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color -import androidx.compose.ui.graphics.RectangleShape import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.text.font.FontWeight -import androidx.compose.ui.text.input.ImeAction import androidx.compose.ui.text.input.KeyboardType -import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import androidx.compose.ui.viewinterop.AndroidView @@ -57,6 +44,8 @@ import com.paypal.messages.config.message.style.PayPalMessageAlign import com.paypal.messages.config.message.style.PayPalMessageColor import com.paypal.messages.config.message.style.PayPalMessageLogoType import com.paypal.messages.io.Api +import com.paypal.messagesdemo.composables.ClientIdField +import com.paypal.messagesdemo.composables.InputField import com.paypal.messagesdemo.ui.BasicTheme fun toSentenceCase(input: String): String { @@ -76,7 +65,7 @@ class JetpackActivity : ComponentActivity() { BasicTheme { val context = LocalContext.current - var clientId: String by remember { mutableStateOf("CLIENT_ID_HERE") } + var clientId: String by remember { mutableStateOf("ASPBQAggBcUvZJ0kFFBizjYapdjokGMcAzBFoC0xIAYY-4iuJH3NxAgkdUEyQ6oCPQiKNRZaWUogS0d6") } // Style Color var backgroundColor by remember { mutableStateOf(Color.White) } @@ -229,12 +218,13 @@ class JetpackActivity : ComponentActivity() { modifier = Modifier.padding(top = 8.dp), ) - ClientIdField( + InputField( text = "Client ID", - clientId = clientId, + value = clientId, onChange = { clientId = it }, + padding = 16.dp ) Text( @@ -295,17 +285,24 @@ class JetpackActivity : ComponentActivity() { FilledButton(text = "Clear", onClick = { offerType = null }, buttonEnabled = buttonEnabled) - AmountField( - amount = amount, + InputField( + text = "Amount", + value = amount, onChange = { amount = it }, + keyboardType = KeyboardType.Number ) - BuyerCountryField( - country = buyerCountry, + InputField( + text = "Buyer Country", + value = buyerCountry, onChange = { buyerCountry = it }, ) - StageTagField(stageTag, onChange = { stageTag = it }) + InputField( + text = "Stage Tag", + value = stageTag, + onChange = { stageTag = it }, + ) Row( horizontalArrangement = Arrangement.SpaceBetween, @@ -343,326 +340,3 @@ class JetpackActivity : ComponentActivity() { } } -@Composable -fun ClientIdField(clientId: String, onChange: (text: String) -> Unit, text: String) { - Row( - modifier = Modifier.padding(vertical = 16.dp), - ) { - Text( - text = text, - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - modifier = Modifier - .width(125.dp) - .height(intrinsicSize = IntrinsicSize.Max) - .align(Alignment.CenterVertically), - ) - - StyledTextField( - value = clientId, - onChange = onChange, - ) - } -} - -@Composable -fun LogoOptions(logoGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { - Row( - horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(top = 8.dp), - ) { - logoGroupOptions.forEach { text -> - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelected(text) }, - ), - ) { - RadioButton( - selected = (text == selected), - onClick = { onSelected(text) }, - modifier = Modifier - .padding(end = Dp(0F)) - .size(Dp(24f)), - ) - Text( - text = text, - fontSize = 14.sp, - modifier = Modifier - .align(Alignment.CenterVertically), - ) - } - } - } -} - -@Composable -fun ColorOptions(colorGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { - Row( - horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(vertical = 4.dp), - ) { - colorGroupOptions.forEach { text -> - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelected(text) }, - ), - ) { - RadioButton( - selected = (text == selected), - onClick = { onSelected(text) }, - modifier = Modifier - .padding(end = Dp(0F)) - .size(Dp(24f)), - ) - Text( - text = text, - fontSize = 14.sp, - modifier = Modifier - .align(Alignment.CenterVertically), - ) - } - } - } -} - -@Composable -fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { - Row( - horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(vertical = 4.dp), - ) { - alignmentGroupOptions.forEach { text -> - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelected(text) }, - ), - ) { - RadioButton( - selected = (text == selected), - onClick = { onSelected(text) }, - modifier = Modifier - .padding(end = Dp(0F)) - .size(Dp(24f)), - ) - - Text( - text = text, - fontSize = 14.sp, - modifier = Modifier - .align(Alignment.CenterVertically), - ) - } - } - } -} - -@Composable -fun OfferOptions(offerGroupOptions: List, selected: String?, onSelected: (text: String) -> Unit) { - Row( - horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(vertical = 4.dp), - ) { - offerGroupOptions.forEach { text -> - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelected(text) }, - ), - ) { - RadioButton( - selected = (text == selected), - onClick = { onSelected(text) }, - modifier = Modifier - .padding(end = Dp(0F)) - .size(Dp(24f)), - ) - - Text( - text = text, - fontSize = 14.sp, - modifier = Modifier - .align(Alignment.CenterVertically), - ) - } - } - } -} - -@Composable -fun AmountField(amount: String, onChange: (text: String) -> Unit) { - Row( - modifier = Modifier.padding(vertical = 8.dp), - ) { - Text( - text = "Amount", - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - modifier = Modifier - .width(125.dp) - .height(intrinsicSize = IntrinsicSize.Max) - .align(Alignment.CenterVertically), - ) - - StyledTextField( - value = amount, - onChange = onChange, - keyboardType = KeyboardType.Number, - ) - } -} - -@Composable -fun BuyerCountryField(country: String, onChange: (text: String) -> Unit) { - Row( - modifier = Modifier.padding(vertical = 9.dp), - ) { - Text( - text = "Buyer Country", - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - modifier = Modifier - .width(125.dp) - .height(intrinsicSize = IntrinsicSize.Max) - .align(Alignment.CenterVertically), - ) - - StyledTextField( - value = country, - onChange = onChange, - ) - } -} - -@Composable -fun StageTagField(stageTag: String, onChange: (text: String) -> Unit) { - Row( - modifier = Modifier.padding(vertical = 8.dp), - ) { - Text( - text = "Stage Tag", - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - modifier = Modifier - .width(125.dp) - .height(intrinsicSize = IntrinsicSize.Max) - .align(Alignment.CenterVertically), - ) - - StyledTextField( - value = stageTag, - onChange = onChange, - ) - } -} - -@Composable -fun IgnoreCacheSwitch(ignoreCache: Boolean, onChange: (text: Boolean) -> Unit) { - Row { - Switch( - checked = ignoreCache, - onCheckedChange = onChange, - ) - - Text( - text = "Ignore Cache", - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - modifier = Modifier - .align(Alignment.CenterVertically) - .padding(start = 8.dp), - ) - } -} - -@Composable -fun DevTouchpointSwitch(devTouchpoint: Boolean, onChange: (text: Boolean) -> Unit) { - Row { - Switch( - checked = devTouchpoint, - onCheckedChange = onChange, - ) - - Text( - text = "Dev Touchpoint", - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - modifier = Modifier - .align(Alignment.CenterVertically) - .padding(start = 8.dp), - ) - } -} - -@Composable -fun FilledButton(onClick: () -> Unit, text: String, buttonEnabled: Boolean) { - var isButtonClicked by remember { mutableStateOf(false) } - Button( - modifier = Modifier.width(intrinsicSize = IntrinsicSize.Min), - enabled = buttonEnabled, - onClick = { - onClick() - isButtonClicked = !isButtonClicked - }, - ) { - Text(text) - } -} - -@Composable -fun StyledTextField( - value: String, - onChange: (text: String) -> Unit, - keyboardType: KeyboardType? = KeyboardType.Text, -) { - Row( - modifier = Modifier - .fillMaxWidth() - .height(36.dp) - .background( - Color.LightGray, - RectangleShape, - ), - ) { - BasicTextField( - value = value, - onValueChange = onChange, - singleLine = true, - textStyle = MaterialTheme.typography.bodyMedium, - keyboardOptions = KeyboardOptions.Default.copy( - keyboardType = keyboardType ?: KeyboardType.Text, - imeAction = ImeAction.Done, - ), - modifier = Modifier - .fillMaxWidth() - .fillMaxHeight() - .padding(start = 4.dp, end = 4.dp, top = 8.dp), - ) - } -} - -@Composable -fun CircularIndicator(progressBar: Boolean) { - if (!progressBar) return - - CircularProgressIndicator( - modifier = Modifier - .width(32.dp), - color = MaterialTheme.colorScheme.secondary, - trackColor = MaterialTheme.colorScheme.surfaceVariant, - ) -} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/AlignmentOptions.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/AlignmentOptions.kt new file mode 100644 index 00000000..2182265d --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/AlignmentOptions.kt @@ -0,0 +1,52 @@ +package com.paypal.messagesdemo + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.IntrinsicSize +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.selection.selectable +import androidx.compose.material3.RadioButton +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp + +@Composable +fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { + Row( + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(vertical = 4.dp), + ) { + alignmentGroupOptions.forEach { text -> + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelected(text) }, + ), + ) { + RadioButton( + selected = (text == selected), + onClick = { onSelected(text) }, + modifier = Modifier + .padding(end = Dp(0F)) + .size(Dp(24f)), + ) + + Text( + text = text, + fontSize = 14.sp, + modifier = Modifier + .align(Alignment.CenterVertically), + ) + } + } + } +} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/CircularIndicator.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/CircularIndicator.kt new file mode 100644 index 00000000..6afef1ec --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/CircularIndicator.kt @@ -0,0 +1,20 @@ +package com.paypal.messagesdemo + +import androidx.compose.foundation.layout.width +import androidx.compose.material3.CircularProgressIndicator +import androidx.compose.material3.MaterialTheme +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.dp + +@Composable +fun CircularIndicator(progressBar: Boolean) { + if (!progressBar) return + + CircularProgressIndicator( + modifier = Modifier + .width(32.dp), + color = MaterialTheme.colorScheme.secondary, + trackColor = MaterialTheme.colorScheme.surfaceVariant, + ) +} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/ColorOptions.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/ColorOptions.kt new file mode 100644 index 00000000..0633c220 --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/ColorOptions.kt @@ -0,0 +1,51 @@ +package com.paypal.messagesdemo + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.IntrinsicSize +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.selection.selectable +import androidx.compose.material3.RadioButton +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp + +@Composable +fun ColorOptions(colorGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { + Row( + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(vertical = 4.dp), + ) { + colorGroupOptions.forEach { text -> + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelected(text) }, + ), + ) { + RadioButton( + selected = (text == selected), + onClick = { onSelected(text) }, + modifier = Modifier + .padding(end = Dp(0F)) + .size(Dp(24f)), + ) + Text( + text = text, + fontSize = 14.sp, + modifier = Modifier + .align(Alignment.CenterVertically), + ) + } + } + } +} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/DevTouchpointSwitch.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/DevTouchpointSwitch.kt new file mode 100644 index 00000000..9d852911 --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/DevTouchpointSwitch.kt @@ -0,0 +1,31 @@ +package com.paypal.messagesdemo + +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Switch +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp + +@Composable +fun DevTouchpointSwitch(devTouchpoint: Boolean, onChange: (text: Boolean) -> Unit) { + Row { + Switch( + checked = devTouchpoint, + onCheckedChange = onChange, + ) + + Text( + text = "Dev Touchpoint", + fontSize = 14.sp, + fontWeight = FontWeight.Bold, + modifier = Modifier + .align(Alignment.CenterVertically) + .padding(start = 8.dp), + ) + } +} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/FilledButton.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/FilledButton.kt new file mode 100644 index 00000000..c6e96cec --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/FilledButton.kt @@ -0,0 +1,28 @@ +package com.paypal.messagesdemo + +import androidx.compose.foundation.layout.IntrinsicSize +import androidx.compose.foundation.layout.width +import androidx.compose.material3.Button +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.ui.Modifier +import androidx.compose.runtime.* + + +@Composable +fun FilledButton(onClick: () -> Unit, text: String, buttonEnabled: Boolean) { + var isButtonClicked by remember { mutableStateOf(false) } + Button( + modifier = Modifier.width(intrinsicSize = IntrinsicSize.Min), + enabled = buttonEnabled, + onClick = { + onClick() + isButtonClicked = !isButtonClicked + }, + ) { + Text(text) + } +} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/IgnoreCacheSwitch.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/IgnoreCacheSwitch.kt new file mode 100644 index 00000000..c6ea3ba1 --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/IgnoreCacheSwitch.kt @@ -0,0 +1,31 @@ +package com.paypal.messagesdemo + +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Switch +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp + +@Composable +fun IgnoreCacheSwitch(ignoreCache: Boolean, onChange: (text: Boolean) -> Unit) { + Row { + Switch( + checked = ignoreCache, + onCheckedChange = onChange, + ) + + Text( + text = "Ignore Cache", + fontSize = 14.sp, + fontWeight = FontWeight.Bold, + modifier = Modifier + .align(Alignment.CenterVertically) + .padding(start = 8.dp), + ) + } +} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/InputField.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/InputField.kt new file mode 100644 index 00000000..815d35c3 --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/InputField.kt @@ -0,0 +1,40 @@ +package com.paypal.messagesdemo.composables + +import androidx.compose.foundation.layout.IntrinsicSize +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.width +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.text.input.KeyboardType +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import com.paypal.messagesdemo.StyledTextField + +@Composable +fun InputField(text: String, value: String, onChange: (text: String) -> Unit, keyboardType: KeyboardType = KeyboardType.Text, padding: Dp = 9.dp) { + Row( + modifier = Modifier.padding(vertical = padding), + ) { + Text( + text = text, + fontSize = 14.sp, + fontWeight = FontWeight.Bold, + modifier = Modifier + .width(125.dp) + .height(intrinsicSize = IntrinsicSize.Max) + .align(Alignment.CenterVertically), + ) + + StyledTextField( + value = value, + onChange = onChange, + keyboardType = keyboardType, + ) + } +} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/LogoOptions.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/LogoOptions.kt new file mode 100644 index 00000000..6643d2c5 --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/LogoOptions.kt @@ -0,0 +1,51 @@ +package com.paypal.messagesdemo + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.IntrinsicSize +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.selection.selectable +import androidx.compose.material3.RadioButton +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp + +@Composable +fun LogoOptions(logoGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { + Row( + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(top = 8.dp), + ) { + logoGroupOptions.forEach { text -> + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelected(text) }, + ), + ) { + RadioButton( + selected = (text == selected), + onClick = { onSelected(text) }, + modifier = Modifier + .padding(end = Dp(0F)) + .size(Dp(24f)), + ) + Text( + text = text, + fontSize = 14.sp, + modifier = Modifier + .align(Alignment.CenterVertically), + ) + } + } + } +} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/OfferOptions.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/OfferOptions.kt new file mode 100644 index 00000000..6ea22774 --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/OfferOptions.kt @@ -0,0 +1,52 @@ +package com.paypal.messagesdemo + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.IntrinsicSize +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.selection.selectable +import androidx.compose.material3.RadioButton +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp + +@Composable +fun OfferOptions(offerGroupOptions: List, selected: String?, onSelected: (text: String) -> Unit) { + Row( + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(vertical = 4.dp), + ) { + offerGroupOptions.forEach { text -> + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelected(text) }, + ), + ) { + RadioButton( + selected = (text == selected), + onClick = { onSelected(text) }, + modifier = Modifier + .padding(end = Dp(0F)) + .size(Dp(24f)), + ) + + Text( + text = text, + fontSize = 14.sp, + modifier = Modifier + .align(Alignment.CenterVertically), + ) + } + } + } +} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/StyledTextField.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/StyledTextField.kt new file mode 100644 index 00000000..c9613b4c --- /dev/null +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/StyledTextField.kt @@ -0,0 +1,50 @@ +package com.paypal.messagesdemo + +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxHeight +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.text.BasicTextField +import androidx.compose.foundation.text.KeyboardOptions +import androidx.compose.material3.MaterialTheme +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.RectangleShape +import androidx.compose.ui.text.input.ImeAction +import androidx.compose.ui.text.input.KeyboardType +import androidx.compose.ui.unit.dp + +@Composable +fun StyledTextField( + value: String, + onChange: (text: String) -> Unit, + keyboardType: KeyboardType? = KeyboardType.Text, +) { + Row( + modifier = Modifier + .fillMaxWidth() + .height(36.dp) + .background( + Color.LightGray, + RectangleShape, + ), + ) { + BasicTextField( + value = value, + onValueChange = onChange, + singleLine = true, + textStyle = MaterialTheme.typography.bodyMedium, + keyboardOptions = KeyboardOptions.Default.copy( + keyboardType = keyboardType ?: KeyboardType.Text, + imeAction = ImeAction.Done, + ), + modifier = Modifier + .fillMaxWidth() + .fillMaxHeight() + .padding(start = 4.dp, end = 4.dp, top = 8.dp), + ) + } +} From d431e9a6f3339344528e506238e4b9b60705d666 Mon Sep 17 00:00:00 2001 From: grablack Date: Wed, 7 Feb 2024 16:52:22 -0500 Subject: [PATCH 17/22] combine switch --- .../paypal/messagesdemo/JetpackActivity.kt | 16 +++++++--- .../composables/DevTouchpointSwitch.kt | 31 ------------------- .../{IgnoreCacheSwitch.kt => SwitchOption.kt} | 6 ++-- 3 files changed, 14 insertions(+), 39 deletions(-) delete mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/DevTouchpointSwitch.kt rename demo/src/main/java/com/paypal/messagesdemo/composables/{IgnoreCacheSwitch.kt => SwitchOption.kt} (83%) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 1421de34..76abcf1f 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -44,7 +44,6 @@ import com.paypal.messages.config.message.style.PayPalMessageAlign import com.paypal.messages.config.message.style.PayPalMessageColor import com.paypal.messages.config.message.style.PayPalMessageLogoType import com.paypal.messages.io.Api -import com.paypal.messagesdemo.composables.ClientIdField import com.paypal.messagesdemo.composables.InputField import com.paypal.messagesdemo.ui.BasicTheme @@ -273,6 +272,7 @@ class JetpackActivity : ComponentActivity() { .width(125.dp) .height(intrinsicSize = IntrinsicSize.Max), ) + FilledButton(text = "Clear", onClick = { offerType = null }, buttonEnabled = buttonEnabled) } OfferOptions( @@ -283,8 +283,6 @@ class JetpackActivity : ComponentActivity() { }, ) - FilledButton(text = "Clear", onClick = { offerType = null }, buttonEnabled = buttonEnabled) - InputField( text = "Amount", value = amount, @@ -310,8 +308,16 @@ class JetpackActivity : ComponentActivity() { .fillMaxWidth() .padding(vertical = 8.dp), ) { - IgnoreCacheSwitch(ignoreCache = ignoreCache, onChange = { ignoreCache = it }) - DevTouchpointSwitch(devTouchpoint = devTouchpoint, onChange = { devTouchpoint = it }) + SwitchOption( + checked = ignoreCache, + onChange = { ignoreCache = it }, + text = " Ignore Cache", + ) + SwitchOption( + checked = devTouchpoint, + onChange = { devTouchpoint = it }, + text = "Dev Touchpoint", + ) } CircularIndicator(progressBar = progessBar) diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/DevTouchpointSwitch.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/DevTouchpointSwitch.kt deleted file mode 100644 index 9d852911..00000000 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/DevTouchpointSwitch.kt +++ /dev/null @@ -1,31 +0,0 @@ -package com.paypal.messagesdemo - -import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.padding -import androidx.compose.material3.Switch -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.Alignment -import androidx.compose.ui.Modifier -import androidx.compose.ui.text.font.FontWeight -import androidx.compose.ui.unit.dp -import androidx.compose.ui.unit.sp - -@Composable -fun DevTouchpointSwitch(devTouchpoint: Boolean, onChange: (text: Boolean) -> Unit) { - Row { - Switch( - checked = devTouchpoint, - onCheckedChange = onChange, - ) - - Text( - text = "Dev Touchpoint", - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - modifier = Modifier - .align(Alignment.CenterVertically) - .padding(start = 8.dp), - ) - } -} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/IgnoreCacheSwitch.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/SwitchOption.kt similarity index 83% rename from demo/src/main/java/com/paypal/messagesdemo/composables/IgnoreCacheSwitch.kt rename to demo/src/main/java/com/paypal/messagesdemo/composables/SwitchOption.kt index c6ea3ba1..b4f82f72 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/IgnoreCacheSwitch.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/SwitchOption.kt @@ -12,15 +12,15 @@ import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp @Composable -fun IgnoreCacheSwitch(ignoreCache: Boolean, onChange: (text: Boolean) -> Unit) { +fun SwitchOption(checked: Boolean, onChange: (text: Boolean) -> Unit, text: String) { Row { Switch( - checked = ignoreCache, + checked = checked, onCheckedChange = onChange, ) Text( - text = "Ignore Cache", + text = text, fontSize = 14.sp, fontWeight = FontWeight.Bold, modifier = Modifier From 051902d4f1b79d65226014b1587c43397ca98af2 Mon Sep 17 00:00:00 2001 From: grablack Date: Thu, 8 Feb 2024 16:45:14 -0500 Subject: [PATCH 18/22] remove unused --- .../paypal/messagesdemo/JetpackActivity.kt | 51 +++++++++--------- .../composables/AlignmentOptions.kt | 52 ------------------- .../messagesdemo/composables/ColorOptions.kt | 51 ------------------ .../{LogoOptions.kt => RadioOptions.kt} | 4 +- 4 files changed, 28 insertions(+), 130 deletions(-) delete mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/AlignmentOptions.kt delete mode 100644 demo/src/main/java/com/paypal/messagesdemo/composables/ColorOptions.kt rename demo/src/main/java/com/paypal/messagesdemo/composables/{LogoOptions.kt => RadioOptions.kt} (91%) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 76abcf1f..4c2ff8e7 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -11,7 +11,6 @@ import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.IntrinsicSize import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.fillMaxHeight import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height @@ -69,27 +68,28 @@ class JetpackActivity : ComponentActivity() { // Style Color var backgroundColor by remember { mutableStateOf(Color.White) } val colorGroupOptions = listOf( - toSentenceCase(PayPalMessageColor.BLACK.name), - toSentenceCase(PayPalMessageColor.WHITE.name), - toSentenceCase(PayPalMessageColor.MONOCHROME.name), - toSentenceCase(PayPalMessageColor.GRAYSCALE.name), + PayPalMessageColor.BLACK, + PayPalMessageColor.WHITE, + PayPalMessageColor.MONOCHROME, + PayPalMessageColor.GRAYSCALE, ) var messageColor by remember { mutableStateOf(colorGroupOptions[0]) } // Style Logo val logoGroupOptions = listOf( - toSentenceCase(PayPalMessageLogoType.PRIMARY.name), - toSentenceCase(PayPalMessageLogoType.INLINE.name), - toSentenceCase(PayPalMessageLogoType.ALTERNATIVE.name), - toSentenceCase(PayPalMessageLogoType.NONE.name), + PayPalMessageLogoType.PRIMARY, + PayPalMessageLogoType.INLINE, + PayPalMessageLogoType.ALTERNATIVE, + PayPalMessageLogoType.NONE, ) + var messageLogo by remember { mutableStateOf(logoGroupOptions[0]) } // Style Alignment val alignmentGroupOptions = listOf( - toSentenceCase(PayPalMessageAlign.LEFT.name), - toSentenceCase(PayPalMessageAlign.CENTER.name), - toSentenceCase(PayPalMessageAlign.RIGHT.name), + PayPalMessageAlign.LEFT, + PayPalMessageAlign.CENTER, + PayPalMessageAlign.RIGHT, ) var messageAlignment by remember { mutableStateOf(alignmentGroupOptions[0]) } @@ -143,15 +143,15 @@ class JetpackActivity : ComponentActivity() { fun updateMessageData() { messageView.clientID = clientId - if (PayPalMessageColor.valueOf(messageColor.uppercase()) === PayPalMessageColor.WHITE) { + if (messageColor === PayPalMessageColor.WHITE) { backgroundColor = Color.Black } else { backgroundColor = Color.White } - messageView.color = PayPalMessageColor.valueOf(messageColor.uppercase()) - messageView.logoType = PayPalMessageLogoType.valueOf(messageLogo.uppercase()) - messageView.alignment = PayPalMessageAlign.valueOf((messageAlignment.uppercase())) + messageView.color = messageColor + messageView.logoType = messageLogo + messageView.alignment = messageAlignment messageView.offerType = when (offerType) { offerGroupOptions[0] -> PayPalMessageOfferType.PAY_LATER_SHORT_TERM @@ -168,6 +168,7 @@ class JetpackActivity : ComponentActivity() { it.toDouble() } } + messageView.buyerCountry = buyerCountry.let { if (it.isBlank()) { null @@ -235,26 +236,26 @@ class JetpackActivity : ComponentActivity() { .height(intrinsicSize = IntrinsicSize.Max), ) - LogoOptions( + RadioOptions( logoGroupOptions = logoGroupOptions, selected = messageLogo, - onSelected = { text: String -> + onSelected = { text: PayPalMessageLogoType -> messageLogo = text - }, + } ) - ColorOptions( - colorGroupOptions = colorGroupOptions, + RadioOptions( + logoGroupOptions = colorGroupOptions, selected = messageColor, - onSelected = { text: String -> + onSelected = { text: PayPalMessageColor -> messageColor = text }, ) - AlignmentOptions( - alignmentGroupOptions = alignmentGroupOptions, + RadioOptions( + logoGroupOptions = alignmentGroupOptions, selected = messageAlignment, - onSelected = { text: String -> + onSelected = { text: PayPalMessageAlign -> messageAlignment = text }, ) diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/AlignmentOptions.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/AlignmentOptions.kt deleted file mode 100644 index 2182265d..00000000 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/AlignmentOptions.kt +++ /dev/null @@ -1,52 +0,0 @@ -package com.paypal.messagesdemo - -import androidx.compose.foundation.layout.Arrangement -import androidx.compose.foundation.layout.IntrinsicSize -import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.height -import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.size -import androidx.compose.foundation.selection.selectable -import androidx.compose.material3.RadioButton -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.Alignment -import androidx.compose.ui.Modifier -import androidx.compose.ui.unit.Dp -import androidx.compose.ui.unit.dp -import androidx.compose.ui.unit.sp - -@Composable -fun AlignmentOptions(alignmentGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { - Row( - horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(vertical = 4.dp), - ) { - alignmentGroupOptions.forEach { text -> - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelected(text) }, - ), - ) { - RadioButton( - selected = (text == selected), - onClick = { onSelected(text) }, - modifier = Modifier - .padding(end = Dp(0F)) - .size(Dp(24f)), - ) - - Text( - text = text, - fontSize = 14.sp, - modifier = Modifier - .align(Alignment.CenterVertically), - ) - } - } - } -} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/ColorOptions.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/ColorOptions.kt deleted file mode 100644 index 0633c220..00000000 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/ColorOptions.kt +++ /dev/null @@ -1,51 +0,0 @@ -package com.paypal.messagesdemo - -import androidx.compose.foundation.layout.Arrangement -import androidx.compose.foundation.layout.IntrinsicSize -import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.height -import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.size -import androidx.compose.foundation.selection.selectable -import androidx.compose.material3.RadioButton -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.Alignment -import androidx.compose.ui.Modifier -import androidx.compose.ui.unit.Dp -import androidx.compose.ui.unit.dp -import androidx.compose.ui.unit.sp - -@Composable -fun ColorOptions(colorGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { - Row( - horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(vertical = 4.dp), - ) { - colorGroupOptions.forEach { text -> - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelected(text) }, - ), - ) { - RadioButton( - selected = (text == selected), - onClick = { onSelected(text) }, - modifier = Modifier - .padding(end = Dp(0F)) - .size(Dp(24f)), - ) - Text( - text = text, - fontSize = 14.sp, - modifier = Modifier - .align(Alignment.CenterVertically), - ) - } - } - } -} diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/LogoOptions.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/RadioOptions.kt similarity index 91% rename from demo/src/main/java/com/paypal/messagesdemo/composables/LogoOptions.kt rename to demo/src/main/java/com/paypal/messagesdemo/composables/RadioOptions.kt index 6643d2c5..f9f5371b 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/LogoOptions.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/RadioOptions.kt @@ -17,7 +17,7 @@ import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp @Composable -fun LogoOptions(logoGroupOptions: List, selected: String, onSelected: (text: String) -> Unit) { +fun >RadioOptions(logoGroupOptions: List, selected: T, onSelected: (text: T) -> Unit) { Row( horizontalArrangement = Arrangement.SpaceEvenly, modifier = Modifier.padding(top = 8.dp), @@ -40,7 +40,7 @@ fun LogoOptions(logoGroupOptions: List, selected: String, onSelected: (t .size(Dp(24f)), ) Text( - text = text, + text = toSentenceCase(text.name), fontSize = 14.sp, modifier = Modifier .align(Alignment.CenterVertically), From 4e900cadb55e88ad9d758a5994ccac0df5d89937 Mon Sep 17 00:00:00 2001 From: grablack Date: Thu, 8 Feb 2024 16:45:59 -0500 Subject: [PATCH 19/22] remove --- demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 4c2ff8e7..038b1ed0 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -63,7 +63,7 @@ class JetpackActivity : ComponentActivity() { BasicTheme { val context = LocalContext.current - var clientId: String by remember { mutableStateOf("ASPBQAggBcUvZJ0kFFBizjYapdjokGMcAzBFoC0xIAYY-4iuJH3NxAgkdUEyQ6oCPQiKNRZaWUogS0d6") } + var clientId: String by remember { mutableStateOf("") } // Style Color var backgroundColor by remember { mutableStateOf(Color.White) } From d14ef37d0e1e79a8a3b2615d779bd2c1e5ef8604 Mon Sep 17 00:00:00 2001 From: grablack Date: Thu, 8 Feb 2024 17:04:38 -0500 Subject: [PATCH 20/22] linting --- .../paypal/messagesdemo/JetpackActivity.kt | 7 +-- .../composables/CircularIndicator.kt | 12 ++-- .../messagesdemo/composables/FilledButton.kt | 23 ++++--- .../messagesdemo/composables/InputField.kt | 44 ++++++++------ .../messagesdemo/composables/OfferOptions.kt | 60 +++++++++---------- .../messagesdemo/composables/RadioOptions.kt | 60 +++++++++---------- .../composables/StyledTextField.kt | 54 ++++++++--------- .../messagesdemo/composables/SwitchOption.kt | 28 ++++----- 8 files changed, 146 insertions(+), 142 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 038b1ed0..f0b3462a 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -224,7 +224,7 @@ class JetpackActivity : ComponentActivity() { onChange = { clientId = it }, - padding = 16.dp + padding = 16.dp, ) Text( @@ -241,7 +241,7 @@ class JetpackActivity : ComponentActivity() { selected = messageLogo, onSelected = { text: PayPalMessageLogoType -> messageLogo = text - } + }, ) RadioOptions( @@ -288,7 +288,7 @@ class JetpackActivity : ComponentActivity() { text = "Amount", value = amount, onChange = { amount = it }, - keyboardType = KeyboardType.Number + keyboardType = KeyboardType.Number, ) InputField( @@ -346,4 +346,3 @@ class JetpackActivity : ComponentActivity() { } } } - diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/CircularIndicator.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/CircularIndicator.kt index 6afef1ec..aadaa7ba 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/CircularIndicator.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/CircularIndicator.kt @@ -11,10 +11,10 @@ import androidx.compose.ui.unit.dp fun CircularIndicator(progressBar: Boolean) { if (!progressBar) return - CircularProgressIndicator( - modifier = Modifier - .width(32.dp), - color = MaterialTheme.colorScheme.secondary, - trackColor = MaterialTheme.colorScheme.surfaceVariant, - ) + CircularProgressIndicator( + modifier = Modifier + .width(32.dp), + color = MaterialTheme.colorScheme.secondary, + trackColor = MaterialTheme.colorScheme.surfaceVariant, + ) } diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/FilledButton.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/FilledButton.kt index c6e96cec..1380eef0 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/FilledButton.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/FilledButton.kt @@ -8,21 +8,20 @@ import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier -import androidx.compose.runtime.* - @Composable fun FilledButton(onClick: () -> Unit, text: String, buttonEnabled: Boolean) { var isButtonClicked by remember { mutableStateOf(false) } - Button( - modifier = Modifier.width(intrinsicSize = IntrinsicSize.Min), - enabled = buttonEnabled, - onClick = { - onClick() - isButtonClicked = !isButtonClicked - }, - ) { - Text(text) - } + Button( + modifier = Modifier.width(intrinsicSize = IntrinsicSize.Min), + enabled = buttonEnabled, + onClick = { + onClick() + isButtonClicked = !isButtonClicked + }, + ) { + Text(text) + } } diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/InputField.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/InputField.kt index 815d35c3..23191932 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/InputField.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/InputField.kt @@ -17,24 +17,30 @@ import androidx.compose.ui.unit.sp import com.paypal.messagesdemo.StyledTextField @Composable -fun InputField(text: String, value: String, onChange: (text: String) -> Unit, keyboardType: KeyboardType = KeyboardType.Text, padding: Dp = 9.dp) { - Row( - modifier = Modifier.padding(vertical = padding), - ) { - Text( - text = text, - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - modifier = Modifier - .width(125.dp) - .height(intrinsicSize = IntrinsicSize.Max) - .align(Alignment.CenterVertically), - ) +fun InputField( + text: String, + value: String, + onChange: (text: String) -> Unit, + keyboardType: KeyboardType = KeyboardType.Text, + padding: Dp = 9.dp, +) { + Row( + modifier = Modifier.padding(vertical = padding), + ) { + Text( + text = text, + fontSize = 14.sp, + fontWeight = FontWeight.Bold, + modifier = Modifier + .width(125.dp) + .height(intrinsicSize = IntrinsicSize.Max) + .align(Alignment.CenterVertically), + ) - StyledTextField( - value = value, - onChange = onChange, - keyboardType = keyboardType, - ) - } + StyledTextField( + value = value, + onChange = onChange, + keyboardType = keyboardType, + ) + } } diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/OfferOptions.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/OfferOptions.kt index 6ea22774..95e386b1 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/OfferOptions.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/OfferOptions.kt @@ -18,35 +18,35 @@ import androidx.compose.ui.unit.sp @Composable fun OfferOptions(offerGroupOptions: List, selected: String?, onSelected: (text: String) -> Unit) { - Row( - horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(vertical = 4.dp), - ) { - offerGroupOptions.forEach { text -> - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelected(text) }, - ), - ) { - RadioButton( - selected = (text == selected), - onClick = { onSelected(text) }, - modifier = Modifier - .padding(end = Dp(0F)) - .size(Dp(24f)), - ) + Row( + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(vertical = 4.dp), + ) { + offerGroupOptions.forEach { text -> + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelected(text) }, + ), + ) { + RadioButton( + selected = (text == selected), + onClick = { onSelected(text) }, + modifier = Modifier + .padding(end = Dp(0F)) + .size(Dp(24f)), + ) - Text( - text = text, - fontSize = 14.sp, - modifier = Modifier - .align(Alignment.CenterVertically), - ) - } - } - } + Text( + text = text, + fontSize = 14.sp, + modifier = Modifier + .align(Alignment.CenterVertically), + ) + } + } + } } diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/RadioOptions.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/RadioOptions.kt index f9f5371b..69fd7cd7 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/RadioOptions.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/RadioOptions.kt @@ -18,34 +18,34 @@ import androidx.compose.ui.unit.sp @Composable fun >RadioOptions(logoGroupOptions: List, selected: T, onSelected: (text: T) -> Unit) { - Row( - horizontalArrangement = Arrangement.SpaceEvenly, - modifier = Modifier.padding(top = 8.dp), - ) { - logoGroupOptions.forEach { text -> - Row( - modifier = Modifier - .height(intrinsicSize = IntrinsicSize.Max) - .padding(end = Dp(8.0F)) - .selectable( - selected = (text == selected), - onClick = { onSelected(text) }, - ), - ) { - RadioButton( - selected = (text == selected), - onClick = { onSelected(text) }, - modifier = Modifier - .padding(end = Dp(0F)) - .size(Dp(24f)), - ) - Text( - text = toSentenceCase(text.name), - fontSize = 14.sp, - modifier = Modifier - .align(Alignment.CenterVertically), - ) - } - } - } + Row( + horizontalArrangement = Arrangement.SpaceEvenly, + modifier = Modifier.padding(top = 8.dp), + ) { + logoGroupOptions.forEach { text -> + Row( + modifier = Modifier + .height(intrinsicSize = IntrinsicSize.Max) + .padding(end = Dp(8.0F)) + .selectable( + selected = (text == selected), + onClick = { onSelected(text) }, + ), + ) { + RadioButton( + selected = (text == selected), + onClick = { onSelected(text) }, + modifier = Modifier + .padding(end = Dp(0F)) + .size(Dp(24f)), + ) + Text( + text = toSentenceCase(text.name), + fontSize = 14.sp, + modifier = Modifier + .align(Alignment.CenterVertically), + ) + } + } + } } diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/StyledTextField.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/StyledTextField.kt index c9613b4c..f2d70735 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/StyledTextField.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/StyledTextField.kt @@ -19,32 +19,32 @@ import androidx.compose.ui.unit.dp @Composable fun StyledTextField( - value: String, - onChange: (text: String) -> Unit, - keyboardType: KeyboardType? = KeyboardType.Text, + value: String, + onChange: (text: String) -> Unit, + keyboardType: KeyboardType? = KeyboardType.Text, ) { - Row( - modifier = Modifier - .fillMaxWidth() - .height(36.dp) - .background( - Color.LightGray, - RectangleShape, - ), - ) { - BasicTextField( - value = value, - onValueChange = onChange, - singleLine = true, - textStyle = MaterialTheme.typography.bodyMedium, - keyboardOptions = KeyboardOptions.Default.copy( - keyboardType = keyboardType ?: KeyboardType.Text, - imeAction = ImeAction.Done, - ), - modifier = Modifier - .fillMaxWidth() - .fillMaxHeight() - .padding(start = 4.dp, end = 4.dp, top = 8.dp), - ) - } + Row( + modifier = Modifier + .fillMaxWidth() + .height(36.dp) + .background( + Color.LightGray, + RectangleShape, + ), + ) { + BasicTextField( + value = value, + onValueChange = onChange, + singleLine = true, + textStyle = MaterialTheme.typography.bodyMedium, + keyboardOptions = KeyboardOptions.Default.copy( + keyboardType = keyboardType ?: KeyboardType.Text, + imeAction = ImeAction.Done, + ), + modifier = Modifier + .fillMaxWidth() + .fillMaxHeight() + .padding(start = 4.dp, end = 4.dp, top = 8.dp), + ) + } } diff --git a/demo/src/main/java/com/paypal/messagesdemo/composables/SwitchOption.kt b/demo/src/main/java/com/paypal/messagesdemo/composables/SwitchOption.kt index b4f82f72..cdda91ef 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/composables/SwitchOption.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/composables/SwitchOption.kt @@ -13,19 +13,19 @@ import androidx.compose.ui.unit.sp @Composable fun SwitchOption(checked: Boolean, onChange: (text: Boolean) -> Unit, text: String) { - Row { - Switch( - checked = checked, - onCheckedChange = onChange, - ) + Row { + Switch( + checked = checked, + onCheckedChange = onChange, + ) - Text( - text = text, - fontSize = 14.sp, - fontWeight = FontWeight.Bold, - modifier = Modifier - .align(Alignment.CenterVertically) - .padding(start = 8.dp), - ) - } + Text( + text = text, + fontSize = 14.sp, + fontWeight = FontWeight.Bold, + modifier = Modifier + .align(Alignment.CenterVertically) + .padding(start = 8.dp), + ) + } } From a01d385a72b9439f106a91af9626e6da395f25a7 Mon Sep 17 00:00:00 2001 From: grablack Date: Fri, 9 Feb 2024 09:52:00 -0500 Subject: [PATCH 21/22] requested changes --- .../paypal/messagesdemo/JetpackActivity.kt | 32 +++++-------------- 1 file changed, 8 insertions(+), 24 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index f0b3462a..8794848f 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -47,11 +47,7 @@ import com.paypal.messagesdemo.composables.InputField import com.paypal.messagesdemo.ui.BasicTheme fun toSentenceCase(input: String): String { - // Convert the string to lowercase and split it into words - val words = input.lowercase().split(" ") - - // Capitalize the first letter of each word and join them back into a string - return words.joinToString(" ") { it -> it.replaceFirstChar { it.titlecase() } } + return input.lowercase().replaceFirstChar { it.titlecase() } } class JetpackActivity : ComponentActivity() { @@ -108,7 +104,7 @@ class JetpackActivity : ComponentActivity() { var devTouchpoint: Boolean by remember { mutableStateOf(false) } var buttonEnabled: Boolean by remember { mutableStateOf(true) } - var progessBar by remember { mutableStateOf(false) } + var progressBar by remember { mutableStateOf(false) } val messageView = PayPalMessageView( context, @@ -116,13 +112,13 @@ class JetpackActivity : ComponentActivity() { data = PayPalMessageData(clientID = clientId, environment = PayPalEnvironment.SANDBOX), viewStateCallbacks = PayPalMessageViewStateCallbacks( onLoading = { - progessBar = true + progressBar = true buttonEnabled = false Toast.makeText(this, "Loading Content...", Toast.LENGTH_SHORT).show() }, onError = { Log.d(TAG, "onError $it") - progessBar = false + progressBar = false runOnUiThread { buttonEnabled = true Toast.makeText(this, it.javaClass.toString() + ":" + it.message, Toast.LENGTH_LONG).show() @@ -130,7 +126,7 @@ class JetpackActivity : ComponentActivity() { }, onSuccess = { Log.d(TAG, "onSuccess") - progessBar = false + progressBar = false runOnUiThread { buttonEnabled = true Toast.makeText(this, "Success Getting Content", Toast.LENGTH_SHORT).show() @@ -161,21 +157,9 @@ class JetpackActivity : ComponentActivity() { else -> null } - messageView.amount = amount.let { - if (it.isBlank()) { - null - } else { - it.toDouble() - } - } + messageView.amount = amount.takeIf { it.isNotBlank() }?.toDouble() - messageView.buyerCountry = buyerCountry.let { - if (it.isBlank()) { - null - } else { - buyerCountry - } - } + messageView.buyerCountry = buyerCountry.takeIf { it.isNotBlank() }?.toString() Api.stageTag = stageTag Api.ignoreCache = ignoreCache @@ -321,7 +305,7 @@ class JetpackActivity : ComponentActivity() { ) } - CircularIndicator(progressBar = progessBar) + CircularIndicator(progressBar = progressBar) AndroidView( modifier = Modifier From 1d06d0aff1504b6b911e955b18035fdddd1b5f45 Mon Sep 17 00:00:00 2001 From: grablack Date: Fri, 9 Feb 2024 10:49:12 -0500 Subject: [PATCH 22/22] missed one --- .../main/java/com/paypal/messagesdemo/JetpackActivity.kt | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt index 8794848f..c1eed4a7 100644 --- a/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt +++ b/demo/src/main/java/com/paypal/messagesdemo/JetpackActivity.kt @@ -139,12 +139,7 @@ class JetpackActivity : ComponentActivity() { fun updateMessageData() { messageView.clientID = clientId - if (messageColor === PayPalMessageColor.WHITE) { - backgroundColor = Color.Black - } else { - backgroundColor = Color.White - } - + backgroundColor = if (messageColor === PayPalMessageColor.WHITE) Color.Black else Color.White messageView.color = messageColor messageView.logoType = messageLogo messageView.alignment = messageAlignment