Creating a UI

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

void main() {
  runApp(MyApp());
}

// this is for button disign:
Column _buttonBuildColumn(Color color, IconData icon, String label) {
  return Column(
    mainAxisSize: MainAxisSize.min,
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      Icon(
        icon,
        color: color,
      ),
      Padding(
        padding: const EdgeInsets.only(top: 8.0),
        child: Container(
          child: Text(
            label,
            style: TextStyle(
              fontSize: 12,
              fontWeight: FontWeight.w400,
              color: color,
            ),
          ),
        ),
      )
    ],
  );
}

//this is for title section :
Widget titleSection = Container(
    padding: const EdgeInsets.all(32.0),
    child: Row(
      children: [
        Expanded(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Padding(
                padding: const EdgeInsets.only(bottom: 8.0),
                child: Text(
                  'Oeschinen Lake Campground ',
                  style: TextStyle(fontWeight: FontWeight.bold),
                ),
              ),
              Text(
                'Kindersteg, SwiftzerLand',
                style: TextStyle(color: Colors.grey.shade500),
              ),
            ],
          ),
        ),
        // this is for like and unlike
        const FavoriteWidget(),
      ],
    ));

// this is color for buttons etc
Color color = Colors.blueAccent;

//This is for text section:
Widget textSection = Padding(
  padding: const EdgeInsets.all(32.0),
  child: Text(
    'Oeschinen Lake (German: Oeschinensee) is a lake in the Bernese '
        'Oberland, Switzerland, 4 kilometres (2.5 mi) east of Kandersteg in'
        ' the Oeschinen valley. At an elevation of 1,578 metres (5,177 ft), '
        'it has a surface area of 1.1147 square kilometres (0.4304 sq mi). Its maximum depth is '
        '56 metres (184 ft).',
    softWrap: true,),


);

// This is for button section:
Widget buttonSection = Row(
  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
  children: [
    _buttonBuildColumn(color, Icons.call, 'CALL'),
    _buttonBuildColumn(color, Icons.near_me, 'ROUTE'),
    _buttonBuildColumn(color, Icons.share, 'SHARE'),
  ],
);


//This is main homepage or we can say main body
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    Color color = Theme
        .of(context)
        .primaryColor;

    return MaterialApp(
      title: 'Welcome to flutter',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  bool loved = true;
  bool not_Loved = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Center(
            child: Text(
              'Welcome to flutter',
              style: TextStyle(fontWeight: FontWeight.bold),
            )),
      ),
      body: ListView(
        children: [ Image.asset('assets/images/lake_image.jpg',
          width: 600,
          height: 240,
          fit: BoxFit.cover,),
         titleSection, buttonSection, textSection

      ],


    ));
  }
}




//This stateful class is for toggleing the star
class FavoriteWidget extends StatefulWidget {
  const FavoriteWidget({super.key});

  @override
  State<FavoriteWidget> createState() => _FavoriteWidgetState();

}
class _FavoriteWidgetState extends State<FavoriteWidget> {
  bool _isFavorited = true;
  int _favoriteCount = 41;
  void _toggleFavorite() {
    setState(() {
      if (_isFavorited) {
        _favoriteCount -= 1;
        _isFavorited = false;
      } else {
        _favoriteCount += 1;
        _isFavorited = true;
      }
    });
  }
  // ···
  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        Container(
          padding: const EdgeInsets.all(0),
          child: IconButton(
            padding: const EdgeInsets.all(0),
            alignment: Alignment.centerRight,
            icon: (_isFavorited
                ? const Icon(Icons.star)
                : const Icon(Icons.star_border)),
            color: Colors.red[500],
            onPressed: _toggleFavorite,
          ),
        ),
        SizedBox(
          width: 18,
          child: SizedBox(
            child: Text('$_favoriteCount'),
          ),
        ),
      ],
    );
  }
}