solution3.dart

import 'package:flutter/material.dart';

void main() => runApp(
      MaterialApp(
        home: BallPage(),
      ),
    );

class BallPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.blue,
      appBar: AppBar(
        backgroundColor: Colors.blue.shade900,
        title: Text('Ask Me Anything'),
      ),
      body: Ball(),
    );
  }
}

class Ball extends StatefulWidget {
  @override
  _BallState createState() => _BallState();
}

class _BallState extends State<Ball> {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Image.asset('images/ball1.png'),
    );
  }
}

Below is my solution and it is working as expected.

import 'dart:math';
import 'package:flutter/material.dart';

void main() {
return runApp(
MaterialApp(
home: Scaffold(
backgroundColor: Colors.blueAccent,
appBar: AppBar(
backgroundColor: Colors.indigo.shade800,
centerTitle: true,
title: const Text(
'Ask Me Anything',
style: TextStyle(
fontSize: 35.0,
),
),
),
body: const BallPage(),
),
),
);
}

class BallPage extends StatefulWidget {
const BallPage({Key? key}) : super(key: key);

@OverRide
State createState() => _BallPageState();
}

class _BallPageState extends State {
int ballNumber = 1;
@OverRide
Widget build(BuildContext context) {
return Center(
child: TextButton(
onPressed: () {
setState(() {
ballNumber = Random().nextInt(5) + 1;
});
},
child: Image(
image: AssetImage('images/ball$ballNumber.png'),
),
),
);
}
}

import 'package:flutter/material.dart';

void main() => runApp(
MaterialApp(
home: BallPage(),
),
);

class BallPage extends StatelessWidget {
@OverRide
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.blue,
appBar: AppBar(
backgroundColor: Colors.blue.shade900,
title: Text('Ask Me Anything'),
),
body: Ball(),
);
}
}

class Ball extends StatefulWidget {
@OverRide
_BallState createState() => _BallState();
}

class _BallState extends State {
@OverRide
Widget build(BuildContext context) {
return Center(
child: Image.asset('images/ball1.png'),
);
}
}

import 'package:flutter/material.dart';

void main() => runApp(
MaterialApp(
home: BallPage(),
),
);

class BallPage extends StatelessWidget {
const BallPage({super.key});

@OverRide
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Ask Me Anything'),
foregroundColor: Colors.white,
backgroundColor: Colors.blueAccent,
),
backgroundColor: Colors.blue.shade900,
body: Ball(),
);
}
}

class Ball extends StatefulWidget {
const Ball({super.key});

@OverRide
State createState() => _BallState();
}

class _BallState extends State {
@OverRide
Widget build(BuildContext context) {
return Center(child: Image.asset(ball1.png));
}
}

import 'package:flutter/material.dart';

void main() => runApp(
MaterialApp(
home: Ball_page(),
),
);

class Ball extends StatefulWidget {
const Ball({super.key});

@OverRide
State createState() => _BallState();
}

class _BallState extends State {
@OverRide
Widget build(BuildContext context) {
return const Ball();
}
}

class Ball_page extends StatelessWidget {
const Ball_page({super.key});

@OverRide
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
backgroundColor: Colors.blue,
appBar: AppBar(
backgroundColor: Colors.blue[900],
title: Text(
'Ask me anything',
style: TextStyle(color: Colors.white),
),
),
body: Center(
child: Container(
child: Image(image: AssetImage('Images/ball1.png')),
),
),
),
);
}
}