Instagram (@unpossiblepoggaming) : https://www.instagram.com/unpog.gaming/
When I upload videos on my youtube channel, I always post it on this blog. But this blog's main focus is to provide more information on programming tutorials which comes in the category of EDUCATION. But the gaming is different, it is mostly an ENTERTAINMENT. So instead of promoting gaming videos on blog, I decided to open an instagram account where gaming videos are more suited.
-------------------------------
Subscribe my Channel:- http://www.youtube.com/user/SanketRooney?sub_confirmation=1
Facebook Page:- https://www.facebook.com/UnpossibleNS
Twitter Account:- https://twitter.com/UnpossiblePOG
Blog
:- https://unpossiblepog.blogspot.in/
Table getDynamicTable() {
List<TableRow> rows = [];
rows.add(TableRow(children: [
Text("Id"),
Text("Name "),
Text("Address "),
Text("Actions"),
]));
if(employeeFinalList!=null)
{
for (int i = 0; i < this.employeeFinalList.length; ++i) {
rows.add(TableRow(children: [
Text(""+employeeFinalList[i]['id'].toString()),
Text("" + employeeFinalList[i]['name'].toString()),
Text("" + employeeFinalList[i]['address'].toString()),
new RaisedButton(
child: new Text('EDIT'),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => insertPage(id:int.parse(employeeFinalList[i]['id']))),
);
},
)
]));
}
}
return Table(
border:TableBorder.all(width: 2.0,color: Colors.black),
columnWidths: {
0: FixedColumnWidth(100.0),
0: FixedColumnWidth(100.0),
1: FlexColumnWidth(),
},
children: rows,
);
}
-------------------------------
2. Create a new dart file at the place where the main.dart file is present. Give it a name as “addEditPage.dart” and paste the following code inside it.
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:<your_project_folder_name>/database_connector.dart';
import 'package:sqflite/sqflite.dart';
import 'main.dart';
class insertPage extends StatelessWidget {
int id;
String name;
String address;
int fetchData=0;
// This widget is the root of your application.
insertPage({this.id});
var txt_1 = TextEditingController();
var txt_2 = TextEditingController();
@override
Widget build(BuildContext context) {
//print(""+id.toString());
if(id!=0)
{
DBConDisplaySpecificId(id);
}
TextStyle textStyle = Theme.of(context).textTheme.title;
return Scaffold(
appBar: AppBar(
title: Text("Second Route"),
),
body: Padding(
padding: EdgeInsets.only(top: 15.0, left: 10.0, right: 10.0),
child: ListView(
children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 15.0, bottom: 15.0),
child: TextField(
controller: txt_1,
style: textStyle,
onChanged: (value) {
debugPrint('Something changed in Name Text Field');
},
decoration: InputDecoration(
labelText: 'Name',
labelStyle: textStyle,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0)
)
),
),
),
Padding(
padding: EdgeInsets.only(top: 15.0, bottom: 15.0),
child: TextField(
controller: txt_2,
style: textStyle,
onChanged: (value) {
debugPrint('Something changed in Address Text Field');
},
decoration: InputDecoration(
labelText: 'Address',
labelStyle: textStyle,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0)
)
),
),
),
Padding(
padding: EdgeInsets.only(top: 15.0, bottom: 15.0),
child: Row(
children: <Widget>[
Expanded(
child: RaisedButton(
color: Theme.of(context).primaryColorDark,
textColor: Theme.of(context).primaryColorLight,
child: Text(
'Save',
textScaleFactor: 1.5,
),
onPressed: () {
debugPrint("Save button clicked");
getValuesFromTextbox();
Navigator.push(
context,
MaterialPageRoute(builder: (context) => MyApp()),
);
},
),
),
Container(width: 5.0,),
],
),
)
]
)
),
);
}
void getValuesFromTextbox()
{
DatabaseConnect con = DatabaseConnect();
final Future<int> dbFuture = con.insertUpdateDynamic(id,txt_1.text,txt_2.text);
}
void DBConDisplaySpecificId(id){
DatabaseConnect con = DatabaseConnect();
List<Map<String, dynamic>> list=[];
final Future<Database> dbFuture = con.initializeDatabase();
dbFuture.then((database) {
Future<List<Map<String, dynamic>>> noteListFuture = con.getSpecificEmployee(id);
noteListFuture.then((emp_data) {
for(var i=0;i<emp_data.length;i++)
{
Map m=emp_data[i];
m.forEach((k,v) =>
{
//print('${k}: ${v}'),
if('${k}'=="name")
{
txt_1.text='${v}',
},
if('${k}'=="address")
{
txt_2.text='${v}',
}
}
);
}
print(emp_data);
});
});
}
}
-------------------------------
3. Then import that file by pasting the following code in “main.dart” file.
import 'addEditPage.dart';
-------------------------------
4. In floating button, onPressed event, add the following code.
() {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => insertPage(id: id)),
);
},
-------------------------------
5. Add new integer variable in the first line of "Widget build" function.
int id=0;
-------------------------------
6. In database_connector.dart file, add the following code inside “DatabaseConnect” class.
Future<int> insertUpdateDynamic(int id,String name,String address) async {
Database db = await this.database;
var result=0;
if(id==0)
{
result = await db.rawInsert("INSERT INTO employee(name,address) VALUES('"+name+"','"+address+"')");
}
else
{
await db.rawUpdate("UPDATE employee set name='"+name+"', address='"+address+"' where id='"+id.toString()+"'");
result=id;
}
return result;
}
Future<List<Map<String, dynamic>>> getSpecificEmployee(int id) async {
Database db = await this.database;
var result = await db.rawQuery('SELECT * FROM employee where id='+id.toString()+' order by id ASC');
return result;
}
-------------------------------
END
-------------------------------
Subscribe my Channel:- http://www.youtube.com/user/SanketRooney?sub_confirmation=1
Facebook Page:- https://www.facebook.com/UnpossibleNS
Twitter Account:- https://twitter.com/UnpossiblePOG
Blog :- https://unpossiblepog.blogspot.in/
-------------------------------
In last part, we displayed database in table format. In this video, we are going create add & edit page from where we can insert or update data.
We already have table structure ready, we shall add new column for edit button.
And we already have add button floating at the bottom of simulator screen.
I created a blog which contains code and instructions.
We just have to copy-paste it.
From 1st point, copy the code and replace the getDynamicTable function.
It will help to add new EDIT column.
For 2nd point, create a new dart file in LIB folder.
Paste the whole code in it.
Make sure to add correct project name, in my case it is “steps”
3rd point says that you have to import newly created file.
From 4th point, onpressed function of floating button, add the given code.
In 5th point, create a new int variable called ID with default value as 0.
From last point, copy the code, go to database_connector.dart file and paste the code inside the class.
Now let’s run the project.
Peter Parker came twice, so I am going to edit the entry.
Let’s add new entry by clicking on floating button.
So that is it, thanks for watching. Like share and subscribe.
You can download the project from :
https://unpossiblepog.com/codes/DART+FLUTTER/Flutter-Redirect-To-Another-Page
1.
To
add a button (on click of which we have to open new page), remove
Center() function and following code.
Column(children: <Widget>[
])
--------------------
2. Then to copy-paste the following code to add a manual button inside box bracket of Column function.
new
RaisedButton(
child: new
Text('Add
Data'),
onPressed:
() {
Navigator.push(
context,
MaterialPageRoute(builder:
(context) => insertPage()),
);
},
)
--------------------
3.
Observe that the function “insertPage” will be highlighted as an
error. We have to call create a new dart page which will have
“insertPage” as a class name.
So create a new dart file, give it any random name.
Then copy-paste the following code in that newly created file.
import
'package:flutter/material.dart';
class
insertPage
extends
StatelessWidget
{
//
This widget is the root of your application.
@override
Widget
build(BuildContext
context) {
TextStyle textStyle = Theme.of(context).textTheme.title;
return Scaffold(
appBar: AppBar(
title: Text("Second
Route"),
),
body:
Padding(
padding: EdgeInsets.only(top:
15.0,
left:
10.0,
right:
10.0),
child:
ListView(
children: <Widget>[
Padding(
padding: EdgeInsets.only(top:
15.0,
bottom:
15.0),
child:
TextField(
//controller:
titleController,
style:
textStyle,
onChanged:
(value) {
debugPrint('Something
changed in Title Text Field');
//updateTitle();
},
decoration:
InputDecoration(
labelText: 'Title',
labelStyle:
textStyle,
border:
OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0)
)
),
),
),
Padding(
padding: EdgeInsets.only(top:
15.0,
bottom:
15.0),
child:
Row(
children: <Widget>[
Expanded(
child: RaisedButton(
color: Theme.of(context).primaryColorDark,
textColor:
Theme.of(context).primaryColorLight,
child:
Text(
'Save',
textScaleFactor:
1.5,
),
onPressed:
() {
debugPrint("Save
button clicked");
//_save(context);
//_showAlertDialog("ok","ok",context);
},
),
),
Container(width:
5.0,),
],
),
)
]
)
),
);
}
}
--------------------
4. After that, we have to call that new file in our main file so copy-paste the following code at the top of main.dart page in import section.
import 'insertPage.dart';
--------------------
DIALOGS:
Subscribe
my Channel:-
http://www.youtube.com/user/SanketRooney?sub_confirmation=1
Facebook
Page:-
https://www.facebook.com/UnpossibleNS
Twitter
Account:-
https://twitter.com/UnpossiblePOG
Hey guys, in this video I shall add a button which will redirect to new page in flutter application.
I have created a new basic project. By default, it has a button which displays click count.
I provided a blog link which contains instructions and codes.
For first instruction, copy the code. In Flutter project, remove the default Center function if you have it.
Paste the code.
Then from second instruction, copy the code, and paste it inside Column function.
You can add 2 buttons, but make sure to add comma between them.
Anyway, currently I will be adding only one button.
As you can see, when I try to save it, it gives me an error.
It is because we currently don’t have insertPage() function.
Change button text if you want to.
Then, from the 3rd instruction, copy the whole code.
In Android Studio, create a new dart file in LIB folder.
Paste the code in it.
Now, we he have to import that newly created dart file inside our main.dart.
Go to the top, import the page. Make sure to give same name as you gave it to a newly created dart file, in my case it is newPage.dart.
Now, let’s check it on simulator.
When I click on a button, it will open a new page.
To go back, there is a back button automatically added.
So that is it, thanks for watching. Like share and subscribe.
You can download the whole folder from:
https://unpossiblepog.com/codes/PHP+HTACCESS/HTACCESS-Forcefully-Add-Slash-At-The-End-Of-URL
.htaccess
RewriteEngine on
RewriteRule ^([^\.]+)/$ $1.php [NC,L]
ErrorDocument 404 http://%{HTTP_HOST}/<project-folder>/error.php?ref=%{HTTP_HOST}%{REQUEST_URI}
-----------------------------------------
error.php
<?php
if(isset($_GET['ref'])) {
$path_name=$_GET['ref'];
$file_name_array=explode("?", $path_name);
//echo $this_path."<br/>";
//echo $file_name_array[0]."<br/>";
if(isset($_SERVER['HTTPS'])){$http_https = "https://";}else{$http_https = "http://";}
$file_name=$http_https.$file_name_array[0];
header("location: ".$file_name."/");
//echo $file_name."<br/>";
}
?>
-----------------------------------------
index.php
<h1>This is INDEX file.</h1>
-----------------------------------------
about.php
<h1>This is About page.</h1>
-----------------------------------------
hello.php
<h1>This is hello page.</h1>
=======================
Subscribe my Channel:- http://www.youtube.com/user/SanketRooney?sub_confirmation=1
Facebook Page:- https://www.facebook.com/UnpossibleNS
Twitter Account:- https://twitter.com/UnpossiblePOG
Blog :- https://unpossiblepog.blogspot.in/
-------------------------------
Hey guys, we shall create a code to force browser to add slash at the end of URL using HTACCESS and PHP.
Make sure to use INCOGNITO mode while implementing this because sometimes the HTACCESS code remains in a cookies which won’t help to run the updated code of HTACCESS.
Currently in folder, we have some PHP files, each file contains some text.
And we have the REWRITE RULE in HTACCESS file which will allow you to run the file without using the “.php” extension. And the rule contains an ending slash in first parameter.
So if you enter the URL without extension and end with slash, it will run that page.
But if you remove the ending slash, it will give you a 404 error. The best solution is to forcefully add ending slash in URL using the code.
So in HTACCESS, write the following code, code link is given in the description.
Notice that this file is inside the “tutorial” folder which is inside HTDOCS folder of xampp.
You have to add the URL accordingly.
So I have already created an error.php page which will forcefully add slash. Code is given in the description.
Our strategy is to send the current URL as a request parameter when error occurs.
And as you can see, it redirects and ends with slash.
So that is it, thanks for watching. Like share and subscribe.
-------------------------------
Putty:- https://www.chiark.greenend.org.uk/~sgtatham/putty/latest.html
SSH Keygen command:-
ssh-keygen -t rsa -b 4096 -C "username@servername"
Subscribe
my Channel:-
http://www.youtube.com/user/SanketRooney?sub_confirmation=1
Facebook Page:- https://www.facebook.com/UnpossibleNS
Twitter Account:- https://twitter.com/UnpossiblePOG
Blog
:- https://unpossiblepog.blogspot.in/
-------------------------------
In this video, we shall make a connection between private github repository and live cpanel.
First you must have a domain with cpanel and a github account.
I purchased a domain+cpanel from godaddy. You can choose your own hosting providers but make sure that the SSH access is enabled. For godaddy users, here is the path to find and enable SSH access.
Next, open github, login into your account, or create account if you don’t have one.
Click on plus icon which is before your profile pic, click on new repository.
Give any random name.
You can make repository as private from here or if you forgot to make it private, you can make it afterward.
Just go to settings tab, scroll down, you will see, “Change repository visibility”, click on a button in front of it and can click on private and save it.
Now,
login into your domain’s cpanel.
Then
open PUTTY. If you don’t have it, download link is given in the
description. Install
it.
Now
copy the IP address from cpanel dashboard.
Paste
it in HOST NAME textbox, make sure that the SSH radio button is
selected, then click on OPEN.
It will open a command prompt.
Type the username which you use for login into cpanel.
Hit enter.
Now
type the cpanel’s login password.
When
you type the password, it will not show anything
on command prompt, but whatever
you are typing is
getting stored in the background.
Once you logged in, you will see something like this.
Once connected, you will have to type the command to create public and private key.
It will be given in the description.
In double quote, type username@servername.
Keep the filename & passphrase empty.
Now, go to cpanel and SSH ACCESS : MANAGE SSH KEYS.
You will see the newly created keys there.
Click on MANAGE of the public key, AUTHORIZE it.
Let’s jump to github, open your repository and click on settings tab, then DEPLOY KEYS. Then ADD DEPLOY KEY.
Give any key name.
For public key, go to cpanel, and click on VIEW/DOWNLOAD link in front of public key.
Copy
it from start to end and paste it in github’s key textarea.
Check
the ALLOW WRITE ACCESS, Of course we already can download files from
github to cpanel by default. But giving the WRITE ACCESS means, you
can upload changes from cpanel to github.
Once done, open the putty command prompt, type the following command to check if the domain can be connected to github or not.
Now we are successfully authenticated.
From
github, lets create a new file. Type
anything there. Give
it any random name.
Scroll
down and commit the change.
You will have a new file in your repository.
Go to cpanel dashboard, click on git version control, then CREATE.
Now open github, click on code, then click on SSH tab, copy the text from the textbox.
Paste it in CLONE URL textbox of cpanel.
For repository path, you can not add those folders which not empty.
For example if I add public_html folder which already has so many files and try to clone it, it will give me an error.
So you can either empty the public_html folder or create a new empty folder which is what I am going to do.
Now you can create a clone of private github repository.
You will be redirected to GIT repository listing. Click on the MANAGE button.
And click on PULL OR DEPLOY.
You will see that those UPDATE AND DEPLOY buttons are disabled.
First, lets check if our original file is copied to our website’s directory by going to the FILE MANAGER.
The file is there and it contains the text that we typed.
Let’s do some changes in github file and try to reflect it to our live site.
To synchronize or pull the changes, lets go to CPANEL’s dashboard : Git version control : MANAGE : PULL OR DEPLOY and click on UPDATE FROM REMOTE.
Lets
again go to file manager, and view
the file.
Changes
are reflected there.
So that is it, thanks for watching. Like share and subscribe.
You can download project from :
https://unpossiblepog.com/codes/DART+FLUTTER/Flutter-And-Dart-Convert-SQFLITE-Data-Into-Map-And-Display-That-Data-In-Table-UI
Note : Watch the video if you are confused to you want to see the practical approach of instructions which are given below.
########## START ##########
1. Copy-paste the following code just after the declaration of class which is extending the state.
List employeeFinalList;
void fixOutputInRows(List<Map<String, dynamic>> emp_data)
{
var columns=new List();
var rows_values=new List();
var properDataArray=new List();
String first_column="";
int loop_run=1;
columns=[];
rows_values=[];
properDataArray=[];
for(var i=0;i<emp_data.length;i++)
{
int col_position=0;
int found_all_colums=0;
Map m=emp_data[i];
m.forEach((k,v) =>
{
if(loop_run==1)
{
first_column='${k}',
},
if(loop_run>1 && first_column=='${k}')
{
found_all_colums=1,
},
if(found_all_colums!=1)
{
columns.add('${k}'),
},
if(loop_run==1)
{
loop_run++,
},
rows_values.add('${v}'),
}
);
}
var added_rows=0;
double total_rows=0;
if(columns.length>0)
{
total_rows=(rows_values.length/columns.length) as double;
}
//print("Total rows : "+(total_rows).toString());
int value_get_count=0;
for(var i=0;i<total_rows;i++)
{
Map temp_array={};
for(var j=0;j<columns.length;j++)
{
temp_array[columns[j]]=rows_values[value_get_count];
value_get_count++;
}
properDataArray.add(temp_array);
}
print(properDataArray);
if(total_rows>0)
{
setState((){
this.employeeFinalList = properDataArray;
});
}
}
3. Call that function just after the “for loop” where we can are getting the data from database table.
fixOutputInRows(emp_data);
4. Remove the whole “Center” function and copy-paste the following the code, make sure that it ends with comma (,)
Column(children:
<Widget>[
Padding(
padding: const
EdgeInsets.all(8.0),
child:
getDynamicTable(),
)])
5. Add the following code just after the ending curly bracket of “Widget build(BuildContext context)”
Table
getDynamicTable()
{
List<TableRow> rows = [];
rows.add(TableRow(children: [
Text("Id"),
Text("Name"),
Text("Address"),
]));
if(employeeFinalList!=null)
{
for
(int
i = 0;
i
< this.employeeFinalList.length;
++i)
{
rows.add(TableRow(children:
[
Text(""+employeeFinalList[i]['id'].toString()),
Text("" +
employeeFinalList[i]['name'].toString()),
Text("" +
employeeFinalList[i]['address'].toString()),
]));
}
}
return
Table(
border:TableBorder.all(width:
2.0,color:
Colors.black),
columnWidths:
{
0:
FixedColumnWidth(100.0),
0:
FixedColumnWidth(100.0),
1:
FlexColumnWidth(),
},
children:
rows,
);
}
6. If you want data to be displayed as soon as the app is loaded, then add the following code inside the curly bracket of “Widget build(BuildContext context)”
if(employeeFinalList==null)
{
DBConDisplay();
}
Previous flutter tutorial (Flutter Database Connection):- https://youtu.be/S95X7Jp7xeM
Code
Link:-
https://unpossiblepog.blogspot.com/2021/03/show-database-table-rows-in-flutter-table-ui.html
Subscribe
my Channel:-
http://www.youtube.com/user/SanketRooney?sub_confirmation=1
Facebook Page:- https://www.facebook.com/UnpossibleNS
Twitter Account:- https://twitter.com/UnpossiblePOG
Blog
:- https://unpossiblepog.blogspot.in/
-------------------------------
In my last flutter database tutorial, I displayed data from table but in columns rather than rows.
This
tutorial is a continuation of the previous tutorial.
In
this video, we
shall display data
in
flutter table. This
tutorial is divided into
2 phases.
Phase 1 is where we are converting data from separate columns into map.
In phase 2, we are displaying those map values in table rows.
If you already have the map structure ready, then skip to phase 2.
Also, I provided the code link in the description, you just have to copy-paste the code as per the instructions.
1st point says, we have to copy-paste the line just after the declaration of a class which is extending the STATE.
2nd point is to copy-paste the whole code just before the ending curly bracket of the same class which is extending the State.
3rd point is to, paste this line after the for loop inside the function which we created to get table data. In my case, the function name is DBConDisplay.
Now, lets refresh the project and see if there map is displaying the data or not.
If the map is displaying in a proper format, it means that our first phase is complete.
In second phase, we shall be adding that map inside flutter table.
So according to the 4th point, remove the CENTER function completely and add the code given in the 4th point. Make sure to add comma at the end of the code where you pasted that function.
As you can see, android studio shows an error at getDyanamicTable function because we haven’t created that function yet.
From 5th point, copy the code and paste it just after the ending curly bracket of widget build function.
Save it.
Now if you have HOT RELOAD enabled, you will see the table appeared on ANDROID SIMULATOR screen. If not, don’t worry. Just go to the 6th point.
From 6th point, copy the code and paste it inside widget build’s curly bracket.
Now, refresh the app, it will display the data as soon as the app loads.
I added some unnecessary texts here, I shall remove it from the document.
So that is it, thanks for watching. Like share and subscribe.