Hello. I created 3 pages. The pages are as follows:
main.dart:
import 'package:flutter/material.dart';
import 'package:fotografci_sitesi/pages/home.dart';
import 'package:fotografci_sitesi/pages/profile.dart';
import 'package:flutter_web_plugins/flutter_web_plugins.dart';
void main() {
setUrlStrategy(PathUrlStrategy());
runApp(mainApp());
}
class mainApp extends StatefulWidget {
mainApp({Key? key}) : super(key: key);
#override
State<mainApp> createState() => _mainAppState();
}
class _mainAppState extends State<mainApp> {
#override
Widget build(BuildContext context) {
return MaterialApp(
initialRoute: '/',
routes: {
homePage.route: (context) => homePage(),
profile.route: (context) => profile(),
},
home: homePage(),
);
}
}
pages/home.dart:
import 'package:flutter/material.dart';
import 'package:fotografci_sitesi/pages/profile.dart';
class homePage extends StatefulWidget {
static const String route = '/home';
homePage({Key? key}) : super(key: key);
#override
State<homePage> createState() => _homePageState();
}
class _homePageState extends State<homePage> {
#override
Widget build(BuildContext context) {
return MaterialApp(
initialRoute: 'Ana ',
home: Scaffold(
appBar: AppBar(
title: Text("Home"),
),
body: Column(
children: [
OutlinedButton(
child: Text("Profile"),
onPressed: () {
Navigator.of(context).pushNamed(profile.route);
},
),
],
),
),
);
}
}
pages/profile.dart:
import 'package:flutter/material.dart';
import 'package:flutter/material.dart';
class profile extends StatefulWidget {
static const String route = '/profile';
profile({Key? key}) : super(key: key);
#override
State<profile> createState() => _profileState();
}
class _profileState extends State<profile> {
#override
Widget build(BuildContext context) {
return MaterialApp(
initialRoute: '/profile',
home: Scaffold(
appBar: AppBar(
title: Text("Profile"),
),
body: Center(
child: Text("Profile"),
),
),
);
}
}
If you look at the codes, I tried to set up a URL system. I want to set up a URL system like this:
If it is entered to example.com, I want it to be redirected to homePage via main.dart.
If I enter example.com/home, I want it to be redirected to homePage.
If it is entered in example.com/profile, I want it to be redirected to profile.
Actually, I did what I wanted, but there is a problem. For example, when I enter example.com/profile, the URL in the address bar changes to example.com/. So it goes to the profile in the URL.
How can I solve this problem?
Sorry if I confused you. I think you understand my problem. Thanks in advance for your help.
Well, I notice you use both initialRoute and home property in the Material app (NB* ONLY USE ONE!!!). Try removing the home property and using only initialRoute. Also as a rule when you use forward slash as an initalRoute use '/' do not use something like '/profile'. compare with code below ...
MaterialApp(
initialRoute: '/',
routes: {
'/': (context) => const homepage(),
'/profile': (context) => const profile(),
},
)
Related
I have made a new file in my views folder but whenever I turn on the emulator and run the code, it just says "Hello World".
Is there a way I can set the starting point of the project to be on this new file? Because it only seems to turn on the main.dart file.
This is the code that is in the views file called home_page.dart . It is supposed to just say "Hi" 10 times.
import 'package:flutter/material.dart';
import '../models/post.dart';
class HomePage extends StatefulWidget {
const HomePage({Key? key}) : super(key: key);
#override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
List<Post>? posts;
var isLoaded = false;
#override
void initState() {
super.initState();
//fetch data from API
getData();
}
getData() async {
// posts = await
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Posts'),
),
body: ListView.builder(
itemCount: 10,
itemBuilder: (context, index) {
return Container(
child: Text('Hi'),
);
},
)
);
}
}
in flutter the main.dart file is the first file
import 'package:flutter/material.dart';
import 'package:get/get_navigation/src/root/get_material_app.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),//add your home page here
);
}
}
I'm trying to take value from the method channel and using the value I'm trying to navigate another screen. When I try to navigate from TextButton onclick it's navigating but when I try to navigate from the value received by the method channel it's not navigating to another screen.
Example: I'm receiving openScreen1 from the method channel in the below code from methodCall.method and assigning the method to route variable but the page is not navigating
main_screen.dart
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:gg_app/screen1.dart';
import 'package:gg_app/screen2.dart';
class HomeScreen extends StatefulWidget {
static const routeName = "Home-Screen";
const HomeScreen({Key? key}) : super(key: key);
#override
State<HomeScreen> createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
static const channel = MethodChannel('scribeemr.in/mic');
#override
void initState() {
// TODO: implement initState
channel.setMethodCallHandler(nativeMethodCallHandler);
super.initState();
}
Future<dynamic> nativeMethodCallHandler(MethodCall methodCall) async {
var route = methodCall.method;
await navigateTo(route, context);
}
Future<dynamic> navigateTo(String route, BuildContext context) async {
switch (route) {
case "openScreen1":
await Navigator.of(context).pushNamed(Screen1.routeName);
break;
case "openScreen2":
await Navigator.of(context).pushNamed(Screen2.routeName);
break;
default:
break;
}
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("Home Screen")),
body: Column(
children: [
TextButton(
onPressed: () {
navigateTo("openScreen1", context);
},
child: Text("Screen 1")),
TextButton(
onPressed: () {
navigateTo("openScreen2", context);
},
child: Text("Screen 2")),
],
),
);
}
}
main.dart
import 'package:flutter/material.dart';
import 'package:gg_app/home_screen.dart';
import 'package:gg_app/screen1.dart';
import 'package:gg_app/screen2.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: HomeScreen(),
routes: {
HomeScreen.routeName: (context) => HomeScreen(),
Screen1.routeName: (context) => Screen1(),
Screen2.routeName: (context) => Screen2(),
},
);
}
}
screen1.dart
import 'package:flutter/material.dart';
class Screen1 extends StatefulWidget {
static const routeName = "Screen1";
const Screen1({ Key? key }) : super(key: key);
#override
State<Screen1> createState() => _Screen1State();
}
class _Screen1State extends State<Screen1> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("Screen 1")),
);
}
}
I've tried everything I can think of to change the background color of my flutter app, but every time I run the app, the background is black.
This is main.dart
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'auth_controller.dart';
import 'themes/color.dart';
import 'index.dart';
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp().then((value) => Get.put(AuthController));
runApp(MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
//ThemeData
title: 'Title',
theme: ThemeData(
brightness: Brightness.light,
),
home:const Index(),
debugShowCheckedModeBanner: false,
);
}
}
I don't think I'm even using themes/color.dart but I thought I'd leave it in anyway. Brightness should set it.
This is index.dart
import 'package:flutter/material.dart';
import 'themes/color.dart';
import 'signup.dart';
Future<void> main() async {
runApp(MyApp(
routes: <String, WidgetBuilder>{
'/signup': (BuildContext context) => const SignUp()
},
debugShowCheckedModeBanner: false,
));
}
class MyApp extends StatelessWidget {
const MyApp({Key? key, required Map<String, WidgetBuilder> routes, required bool debugShowCheckedModeBanner}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Welcome to Flutter',
home: Scaffold(
backgroundColor: const Color(0xFFe3e4e4),
appBar: AppBar(
title: const Text('Flutter Screen Background Color Example'),
),
body: const Center(child: Index()),
),
);
}
}
class Index extends StatelessWidget {
const Index({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const SizedBox(height: 20,),
ElevatedButton(
child: const Text('WTF'),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => const SignUp()),
);
}
),
]
)
);
}
}
It seems like the background should be a light grey,but it's black. I tried invalidating the caches and restarting too.
Here I have two pages one is **nav.dart and function name is Nav() (navigation Bar) ** and another is card.dart Function name id DashboardCard()
How to connect these two function to my home page
import 'package:flutter/material.dart';
import 'package:enkindle/nav.dart';
import 'package:enkindle/card.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Material App',
theme: ThemeData(fontFamily: 'Raleway'),
home: Scaffold(
backgroundColor: Colors.white,
body: HomePage(),
),
);
}
}
class HomePage extends StatefulWidget {
HomePage({Key key}) : super(key: key);
#override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
#override
Widget build(BuildContext context) {
return Container(
child:
);
}
}
'''
All you require is to Navigate.push() action when a button is pressed. Use something like this:
class _HomePageState extends State<HomePage> {
#override
Widget build(BuildContext context) {
return Container(
child: ElevatedButton(
child: Text('Open route'),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => SecondRoute()),
);
},
),
);
}
}
Where SecondRoute() is your second route you want to navigate to.
And to come back to previous page, use the code below in a container or wherever you want:
child: ElevatedButton(
onPressed: () {
Navigator.pop(context);
},
child: Text('Go back!'),
),
),
I'm trying to get my head around the Providers in Flutters... but after following some tutorials, I'm still facing some issue.
When I try to run this code, it gives me an error
Error: Could not find the correct Provider above this MyHomePage Widget
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:provider_way/MyHomePageViewModel.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return ChangeNotifierProvider(
create: (context) => MyHomePageViewModel(),
child: Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Consumer<MyHomePageViewModel>(
builder: (context, viewModel, child) {
return Text(viewModel.text);
},
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: () =>
Provider.of<MyHomePageViewModel>(context, listen: false)
.onClicked(),
tooltip: 'Increment',
child: Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
),
);
}
}
import 'package:flutter/foundation.dart';
class MyHomePageViewModel extends ChangeNotifier {
String text = 'Initial text';
void onClicked() {
text = 'Something was clicked';
notifyListeners();
}
}
The website where I found this example use it as
Provider.of<MainViewModel>(context, listen: false).onClicked(),
But that doesn't work either...
Before a widget that needs a provider is presented, it is required you create that particular provider before the page is built.
Checkout the working sample of your code below.
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:provider_way/MyHomePageViewModel.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return ChangeNotifierProvider(
create: (_) => MyHomePageViewModel(),
builder: (_, __) => MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Consumer<MyHomePageViewModel>(
builder: (context, viewModel, child) {
return Text(viewModel.text);
},
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: () =>
Provider.of<MyHomePageViewModel>(context, listen: false)
.onClicked(),
tooltip: 'Increment',
child: Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}
import 'package:flutter/foundation.dart';
class MyHomePageViewModel extends ChangeNotifier {
String text = 'Initial text';
void onClicked() {
text = 'Something was clicked';
notifyListeners();
}
}
In your provider code, do you have a class defined like:
class MyHomePageViewModel extends ChangeNotifier {
// your stuff here, like getter and setters, methods, etc
}
That class will deal with all the centralisation of your states, essentially acting as you'd hope - the provider.