First Android app: Android Basics with Compose

[donbright]

URL of codelab

https://developer.android.com/codelabs/basic-android-kotlin-compose-first-app?continue=https%3A%2F%2Fdeveloper.android.com%2Fcourses%2Fpathways%2Fandroid-basics-compose-unit-1-pathway-2%23codelab-https%3A%2F%2Fdeveloper.android.com%2Fcodelabs%2Fbasic-android-kotlin-compose-first-app#4

In which task and step of the codelab can this issue be found?

Surface()

Describe the problem

None of the following functions can be called with the arguments supplied: public constructor Surface(surfaceTexture: SurfaceTexture!) defined in android.view.Surface public constructor Surface(from: SurfaceControl) defined in android.view.Surface

Steps to reproduce?

1. Go to... Android Studio
2. Click on... The steps in the First Android Issue walkthrough
3. See error... when you try to add Surface()

Versions Android Studio version: API version of the emulator:

Android Studio Jellyfish | 2023.3.1 Patch 1 Build #AI-233.14808.21.2331.11842104, built on May 14, 2024 Runtime version: 17.0.10+0-17.0.10b1087.21-11572160 amd64 VM: OpenJDK 64-Bit Server VM by JetBrains s.r.o. Linux 6.5.0-35-generic GC: G1 Young Generation, G1 Old Generation Memory: 2048M Cores: 24 Registry: ide.experimental.ui=true Current Desktop: X-Cinnamon

Additional information Include screenshots if they would be useful in clarifying the problem.

[donbright]

here is code that actually works in my version of A. Studio, based on right clicking error lines and having it import the correct stuff.

package com.example.greetingcard

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import com.example.greetingcard.ui.theme.GreetingCardTheme

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContent {
            GreetingCardTheme {
                Scaffold(modifier = Modifier.fillMaxSize()) { innerPadding ->
                    Greeting(
                            name = "Android",
                            modifier = Modifier.padding(innerPadding)
                    )
                }
            }
        }
    }
}

@Composable
fun Greeting(name: String, modifier: Modifier = Modifier) {
    Surface(color = Color.Cyan) {
        Text(
            text = "Hello my name is $name!",
            modifier = modifier
        )
    }
}

@Preview(showBackground = true)
@Composable
fun GreetingPreview() {
    GreetingCardTheme {
        Greeting("bilbo bagginess")
    }
}

[radbobdad]

The real issue is that the codelab has not been updated to sync up with the current "No Activity" project template, which uses Scaffold (or else the template lags behind the codelab, which seems unlikely). The codelab uses Surface.

An alternative, until the codelab instructions are updated, is to change the method ComponentActivity::onCreate to use Surface. Then the current codelab instructions can be followed directly. Here is code that works for me:

package com.example.happybirthday

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import com.example.happybirthday.ui.theme.HappyBirthdayTheme

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContent {
            HappyBirthdayTheme {
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                    ) {
                }
            }
        }
    }
}

@Composable
fun GreetingText(message: String, modifier: Modifier = Modifier) {
        Text(
            text = message,
            modifier = modifier
        )
}

@Preview(showBackground = true)
@Composable
fun BirthdayCardPreview() {
    HappyBirthdayTheme {
        GreetingText(message = "Happy Birthday Bilbo!")
    }
}