gpesquero/organicmaps
1
Fork 0
forked from organicmaps/organicmaps
Code Pull requests Activity

android: replace blurriness with dark container on auth, ios: add developedByLabel on sign up screen

Browse source
This commit is contained in:
Emin 2024-10-11 14:24:57 +05:00
parent de69678a96
commit 93c0970275
8 changed files with 74 additions and 70 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
android/app/build.gradle
View file

@ -392,8 +392,6 @@ dependencies {
implementation "androidx.navigation:navigation-compose:2.8.0-beta03"
implementation "org.jetbrains.kotlinx:kotlinx-serialization-json:1.6.3"
// blurriness
implementation "com.github.skydoves:cloudy:0.1.2"
// countries
implementation 'com.hbb20:ccp:2.7.3'
// webview

18
android/app/src/main/java/app/tourism/Constants.kt
View file

@ -4,12 +4,9 @@ import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.draw.drawBehind
import androidx.compose.ui.graphics.BlendMode
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
@ -63,3 +60,18 @@ fun Modifier.drawOverlayForTextBehind() =
)
)
)
@Composable
fun Modifier.drawDarkContainerBehind(): Modifier {
val alpha = 0.4f
return this
.clip(RoundedCornerShape(20.dp))
.background(
Brush.verticalGradient(
colors = listOf(
Color.Black.copy(alpha = alpha),
Color.Black.copy(alpha = alpha)
)
)
)
}

54
android/app/src/main/java/app/tourism/ui/common/BlurryContainer.kt
View file

@ -1,54 +0,0 @@
package app.tourism.ui.common
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.shape.RoundedCornerShape
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.draw.clip
import androidx.compose.ui.layout.onSizeChanged
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.unit.dp
import com.skydoves.cloudy.Cloudy
import com.skydoves.cloudy.CloudyState
@Composable
fun BlurryContainer(modifier: Modifier = Modifier, content: @Composable () -> Unit) {
val localDensity = LocalDensity.current
val cloudyState = remember { mutableStateOf<CloudyState>(CloudyState.Nothing) }
Box(Modifier.then(modifier)) {
var height by remember { mutableStateOf(0.dp) }
Cloudy(
radius = 25,
modifier = Modifier
.fillMaxWidth()
.height(height)
.align(Alignment.Center)
.clip(RoundedCornerShape(16.dp)),
onStateChanged = {
println("cloudyState: $cloudyState")
cloudyState.value = it
}
) {}
if (cloudyState.value is CloudyState.Success || cloudyState.value is CloudyState.Error || cloudyState.value is CloudyState.Loading)
Column(
Modifier
.align(Alignment.Center)
.onSizeChanged { newSize ->
height = with(localDensity) { newSize.height.toDp() }
}
) {
content()
}
}
}

17
android/app/src/main/java/app/tourism/ui/screens/auth/sign_in/SignInScreen.kt
View file

@ -1,13 +1,16 @@
package app.tourism.ui.screens.auth.sign_in
import PasswordEditText
import android.view.RoundedCorner
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.Text
@ -16,7 +19,9 @@ import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.focus.FocusDirection
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.platform.LocalContext
@ -31,6 +36,7 @@ import app.organicmaps.R
import app.tourism.BASE_URL
import app.tourism.Constants
import app.tourism.domain.models.resource.Resource
import app.tourism.drawDarkContainerBehind
import app.tourism.drawOverlayForTextBehind
import app.tourism.ui.ObserveAsEvents
import app.tourism.ui.common.VerticalSpace
@ -84,11 +90,12 @@ fun SignInScreen(
.align(Alignment.TopCenter)
) {
VerticalSpace(height = 80.dp)
Box(Modifier.padding(Constants.SCREEN_PADDING)) {
Image(
painter = painterResource(id = R.drawable.blur_background),
contentDescription = null
)
Box(
Modifier
.padding(Constants.SCREEN_PADDING)
.drawDarkContainerBehind()
) {
Column(Modifier.padding(36.dp)) {
Text(
modifier = Modifier.align(Alignment.CenterHorizontally),

8
android/app/src/main/java/app/tourism/ui/screens/auth/sign_up/SignUpScreen.kt
View file

@ -32,6 +32,7 @@ import androidx.hilt.navigation.compose.hiltViewModel
import app.organicmaps.R
import app.tourism.Constants
import app.tourism.domain.models.resource.Resource
import app.tourism.drawDarkContainerBehind
import app.tourism.drawOverlayForTextBehind
import app.tourism.ui.ObserveAsEvents
import app.tourism.ui.common.VerticalSpace
@ -93,11 +94,8 @@ fun SignUpScreen(
.align(alignment = Alignment.TopCenter)
) {
VerticalSpace(height = 48.dp)
Box(Modifier.padding(Constants.SCREEN_PADDING)) {
Image(
painter = painterResource(id = R.drawable.blur_background),
contentDescription = null
)
Box(Modifier.padding(Constants.SCREEN_PADDING)
.drawDarkContainerBehind()) {
Column(
Modifier.padding(36.dp)
) {

BIN
android/app/src/main/res/drawable/blur_background.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 10 KiB

10
android/app/src/main/res/drawable/blur_background.xml Normal file
View file

@ -0,0 +1,10 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="359dp"
android:height="466dp"
android:viewportWidth="359"
android:viewportHeight="466">
<path
android:pathData="M20,0L339,0A20,20 0,0 1,359 20L359,446A20,20 0,0 1,339 466L20,466A20,20 0,0 1,0 446L0,20A20,20 0,0 1,20 0z"
android:fillColor="#ffffff"
android:fillAlpha="0.1"/>
</vector>

35
iphone/Maps/Tourism/Presentation/Auth/Screens/SignUpViewController.swift
View file

@ -105,15 +105,38 @@ class SignUpViewController: UIViewController {
return button
}()
private let developedByLabel: UILabel = {
let label = UILabel()
label.text = L("developed_by_label")
label.textColor = .white
UIKitFont.applyStyle(to: label, style: UIKitFont.h4)
applyWrapContent(label: label)
label.translatesAutoresizingMaskIntoConstraints = false
return label
}()
override func viewDidLoad() {
super.viewDidLoad()
setupViews()
}
private func setupViews() {
let gradientView = UIView(frame: CGRect(x: 0, y: view.height - 100, width: view.width, height: 100))
let tapGesture = UITapGestureRecognizer(target: self, action: #selector(developedByLabelTapped))
gradientView.addGestureRecognizer(tapGesture)
gradientView.isUserInteractionEnabled = true
let gradient = CAGradientLayer()
gradient.frame = gradientView.bounds
gradient.colors = [UIColor.clear.cgColor, UIColor.black.cgColor]
gradientView.layer.insertSublayer(gradient, at: 0)
view.addSubview(backgroundImageView)
view.addSubview(backButton)
view.addSubview(containerView)
view.addSubview(gradientView)
view.addSubview(developedByLabel)
containerView.addSubview(blurView)
containerView.addSubview(titleLabel)
@ -193,7 +216,10 @@ class SignUpViewController: UIViewController {
// Forgot Password Button
forgotPasswordButton.topAnchor.constraint(equalTo: signUpButton.bottomAnchor, constant: 20),
forgotPasswordButton.leadingAnchor.constraint(equalTo: containerView.leadingAnchor, constant: 32),
forgotPasswordButton.bottomAnchor.constraint(equalTo: containerView.bottomAnchor, constant: -32)
forgotPasswordButton.bottomAnchor.constraint(equalTo: containerView.bottomAnchor, constant: -32),
developedByLabel.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -16),
developedByLabel.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -32)
])
backButton.addTarget(self, action: #selector(backButtonTapped), for: .touchUpInside)
@ -236,6 +262,13 @@ class SignUpViewController: UIViewController {
self.navigationController?.popViewController(animated: false)
}
@objc func developedByLabelTapped() {
print("developedByLabelTapped")
if let url = URL(string: "https://rebus.tj") {
UIApplication.shared.open(url)
}
}
// MARK: - other functions
private func showError(message: String) {
signUpButton.isLoading = false