android/ui: add one-time intro screen (#253)
* android/ui: add one-time intro screen fixes ENG-2910 adds a one-time intro screen mostly identical to the one presented in the legacy app. Signed-off-by: Jonathan Nobels <jonathan@tailscale.com> * android/ui: string change tailscale -> Tailscale Co-authored-by: Andrea Gottardo <andrea@tailscale.com> Signed-off-by: Jonathan Nobels <jnobels@gmail.com> --------- Signed-off-by: Jonathan Nobels <jonathan@tailscale.com> Signed-off-by: Jonathan Nobels <jnobels@gmail.com> Co-authored-by: Andrea Gottardo <andrea@tailscale.com>pull/257/head
parent
4baec5ff80
commit
cf56dd6793
@ -0,0 +1,62 @@
|
||||
// Copyright (c) Tailscale Inc & AUTHORS
|
||||
// SPDX-License-Identifier: BSD-3-Clause
|
||||
|
||||
package com.tailscale.ipn.ui.view
|
||||
|
||||
import androidx.compose.foundation.Image
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.foundation.layout.Spacer
|
||||
import androidx.compose.foundation.layout.fillMaxHeight
|
||||
import androidx.compose.foundation.layout.height
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.material3.MaterialTheme
|
||||
import androidx.compose.material3.Surface
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.draw.clip
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.res.painterResource
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.unit.dp
|
||||
import com.tailscale.ipn.R
|
||||
|
||||
@Composable
|
||||
fun IntroView(onContinue: () -> Unit) {
|
||||
Surface {
|
||||
Column(
|
||||
modifier = Modifier.fillMaxHeight().padding(20.dp),
|
||||
horizontalAlignment = Alignment.CenterHorizontally) {
|
||||
Spacer(modifier = Modifier.height(30.dp))
|
||||
Image(
|
||||
modifier =
|
||||
Modifier.width(140.dp)
|
||||
.height(140.dp)
|
||||
.clip(RoundedCornerShape(50))
|
||||
.background(Color.Black)
|
||||
.padding(15.dp),
|
||||
painter = painterResource(id = R.drawable.ic_tile),
|
||||
contentDescription = stringResource(R.string.app_icon_content_description))
|
||||
Spacer(modifier = Modifier.height(10.dp))
|
||||
Text(
|
||||
text = stringResource(R.string.tailscale),
|
||||
style = MaterialTheme.typography.headlineLarge)
|
||||
Spacer(modifier = Modifier.height(20.dp))
|
||||
Text(
|
||||
text = stringResource(R.string.welcome1),
|
||||
style = MaterialTheme.typography.bodyMedium,
|
||||
textAlign = TextAlign.Center)
|
||||
Spacer(modifier = Modifier.height(20.dp))
|
||||
PrimaryActionButton(onClick = onContinue) {
|
||||
Text(
|
||||
text = stringResource(id = R.string.getStarted),
|
||||
fontSize = MaterialTheme.typography.titleMedium.fontSize)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue