Please Subscribe My YouTube Channel

Wednesday, November 01, 2023

How To Create A Text Editor Such as Notepad with Python

How To Create A Text Editor Such as Notepad with Python

import tkinter

import os

from tkinter import *

from tkinter.messagebox import *

from tkinter.filedialog import *         




class Notepad:

    __root = Tk()


    # default window width and height

    __thisWidth = 500

    __thisHeight = 500

    __thisTextArea = Text(__root)

    __thisMenuBar = Menu(__root)

    __thisFileMenu = Menu(__thisMenuBar, tearoff=0)

    __thisEditMenu = Menu(__thisMenuBar, tearoff=0)

    __thisHelpMenu = Menu(__thisMenuBar, tearoff=0)


    # To add scrollbar

    __thisScrollBar = Scrollbar(__thisTextArea)

    __file = None


    def __init__(self, **kwargs):


        # Set icon

        try:

            self.__root.wm_iconbitmap("Notepad.ico")

        except:

            pass


        # Set window size (the default is 300x300)


        try:

            self.__thisWidth = kwargs['width']

        except KeyError:

            pass


        try:

            self.__thisHeight = kwargs['height']

        except KeyError:

            pass


        # Set the window text

        self.__root.title("Untitled - Notepad")


        # Center the window

        screenWidth = self.__root.winfo_screenwidth()

        screenHeight = self.__root.winfo_screenheight()


        # For left-alling

        left = (screenWidth / 2) - (self.__thisWidth / 2)


        # For right-allign

        top = (screenHeight / 2) - (self.__thisHeight / 2)


        # For top and bottom

        self.__root.geometry('%dx%d+%d+%d' % (self.__thisWidth,

                                              self.__thisHeight,

                                              left, top))


        # To make the textarea auto resizable

        self.__root.grid_rowconfigure(0, weight=1)

        self.__root.grid_columnconfigure(0, weight=1)


        # Add controls (widget)

        self.__thisTextArea.grid(sticky=N + E + S + W)


        # To open new file

        self.__thisFileMenu.add_command(label="New",

                                        command=self.__newFile)


        # To open a already existing file

        self.__thisFileMenu.add_command(label="Open",

                                        command=self.__openFile)


        # To save current file

        self.__thisFileMenu.add_command(label="Save",

                                        command=self.__saveFile)


        # To create a line in the dialog

        self.__thisFileMenu.add_separator()

        self.__thisFileMenu.add_command(label="Exit",

                                        command=self.__quitApplication)

        self.__thisMenuBar.add_cascade(label="File",

                                       menu=self.__thisFileMenu)


        # To give a feature of cut

        self.__thisEditMenu.add_command(label="Cut",

                                        command=self.__cut)


        # to give a feature of copy

        self.__thisEditMenu.add_command(label="Copy",

                                        command=self.__copy)


        # To give a feature of paste

        self.__thisEditMenu.add_command(label="Paste",

                                        command=self.__paste)


        # To give a feature of editing

        self.__thisMenuBar.add_cascade(label="Edit",

                                       menu=self.__thisEditMenu)


        # To create a feature of description of the notepad

        self.__thisHelpMenu.add_command(label="About Notepad",

                                        command=self.__showAbout)

        self.__thisMenuBar.add_cascade(label="Help",

                                       menu=self.__thisHelpMenu)


        self.__root.config(menu=self.__thisMenuBar)


        self.__thisScrollBar.pack(side=RIGHT, fill=Y)


        # Scrollbar will adjust automatically according to the content

        self.__thisScrollBar.config(command=self.__thisTextArea.yview)

        self.__thisTextArea.config(yscrollcommand=self.__thisScrollBar.set)


    def __quitApplication(self):

        self.__root.destroy()

        # exit()


    def __showAbout(self):

        showinfo("Notepad", "This is a simple Notepad editor created with Python with Tkinter. This editor can create new file, edit file ,cut,copy and paste features will be available ")


    def __openFile(self):


        self.__file = askopenfilename(defaultextension=".txt",

                                      filetypes=[("All Files", "*.*"),

                                                 ("Text Documents", "*.txt")])


        if self.__file == "":


            # no file to open

            self.__file = None

        else:


            # Try to open the file

            # set the window title

            self.__root.title(os.path.basename(self.__file) + " - Notepad")

            self.__thisTextArea.delete(1.0, END)


            file = open(self.__file, "r")


            self.__thisTextArea.insert(1.0, file.read())


            file.close()


    def __newFile(self):

        self.__root.title("Untitled - Notepad")

        self.__file = None

        self.__thisTextArea.delete(1.0, END)


    def __saveFile(self):


        if self.__file == None:

            # Save as new file

            self.__file = asksaveasfilename(initialfile='Untitled.txt',

                                            defaultextension=".txt",

                                            filetypes=[("All Files", "*.*"),

                                                       ("Text Documents", "*.txt")])


            if self.__file == "":

                self.__file = None

            else:


                # Try to save the file

                file = open(self.__file, "w")

                file.write(self.__thisTextArea.get(1.0, END))

                file.close()


                # Change the window title

                self.__root.title(os.path.basename(self.__file) + " - Notepad")



        else:

            file = open(self.__file, "w")

            file.write(self.__thisTextArea.get(1.0, END))

            file.close()


    def __cut(self):

        self.__thisTextArea.event_generate("<<Cut>>")


    def __copy(self):

        self.__thisTextArea.event_generate("<<Copy>>")


    def __paste(self):

        self.__thisTextArea.event_generate("<<Paste>>")


    def run(self):


        # Run main application

        self.__root.mainloop()


notepad = Notepad(width=800,height=500)

notepad.run()

How To Create Animated Login Form(O level)

How To Create Animated Login Form

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Animated Login Form</title>
</head>

<style>
    body {
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 50px;
        font-family: sans-serif;
        overflow: hidden;
        background: linear-gradient(45deg, greenyellow, dodgerblue);
    }

    .card {
        padding: 50px;
        background-color: white;
        border-radius: 10px;
    }

    .card h1 {
        border-left: 7px solid #ffa400;
        padding: 2px 10px;
    }

    .inputbox {
        position: relative;
        height: 50px;
        width: 300px;
        margin-bottom: 50px;

    }

    .inputbox input {
        width: 100%;
        border: 2px solid black;
        padding: 10px;
        border-radius: 10px;
        font-size: 19px;
    }

    .inputbox:last-child {
        width: 50%;
        margin-bottom: 0;
    }

    .inputbox span {
        position: absolute;
        top: 14px;
        left: 20px;
        font-size: 16px;
        transition: 0.6s;
    }

    .inputbox:hover span,
    .inputbox input:focus~span,
    .inputbox input:valid~span {
        transform: translateX(-13px) translateY(-35px);
    }

    .inputbox [type="button"] {
        border: none;
        color: white;
        background-color: #ff00ff;
    }

    .inputbox:hover [type="button"] {
        background: linear-gradient(45deg, greenyellow, dodgerblue,green,red);
    }

    @media only screen and (max-width: 600px) {
        .card {
            padding: 10px;
        }

        .inputbox {
            width: 250px;
        }

        .inputbox input {
            width: 220px;
        }

        .inputbox [type="button"] {
            width: max-content;
            border-radius: 5px;
            padding: 7px 10px;
        }
    }

    .chijl {
        text-decoration: none;
        width: 40vw;
        padding: 15px;
        border-radius: 5px;
        text-align: center;
        font-size: 20px;
        color: #fff;
        background-color: #ff0000;
    }
</style>

<body>

    <div class="card">
        <h1>Login.....</h1>

        <form>

            <div class="inputbox">
                <input type="text" required>
                <span>Email</span>
            </div>

            <div class="inputbox">
                <input type="password" required>
                <span>Password</span>
            </div>

            <div class="inputbox">
                <input type="button" value="Submit">
            </div>

        </form>     


    </div>

    <a href="https://www.youtube.com/channel/UC-R0Dt24rWVEov_kzDmSLDQ" target="_chijl" class="chijl">Subscribe My You Tube Channel</a>

</body>

</html>

Monday, October 30, 2023

HTML & CSS (Registration Form/Application Form)

Create a Registration (Application) Form 








<html>
<head>
<title>APPLICATION FORM </title>
<style>
input:focus {box-shadow: 2px 1px 4px 2px skyblue;}


.mybutton {
color: rgb(255, 255, 255); font-size: 12px; line-height: 16px; padding: 6px; border-radius: 5px; font-family: Georgia, serif; font-weight: bold; background-image: linear-gradient(to right, rgb(28, 110, 164) 0%, rgb(35, 136, 203) 41%, rgb(20, 78, 117) 100%); box-shadow: rgb(0, 0, 0) 5px 5px 15px 5px; border: 2px solid rgb(28, 110, 164); display: inline-block;}
.mybutton:hover {
background: springgreen;color:blue; }
.mybutton:active {
background: orangered; }
legend{background:red;color:white; }
fieldset{border:3px solid darkslateblue;}
fieldset:hover{border:2px solid blue;}
legend:hover{background:darkgreen;font-size: 20px;}
</style>                                                                  
</head>
<body leftmargin="200px">

<center><h1>ITCI Computer Institute Hardoi</h1>
<h2>Address:- Near SBI Bank, Infront of Gandhi Bhawan Hardoi UP Pin 241001<br>&phone; +91 9026728220, +91 8423606968</h2>
<hr size="10"color="red"width="600">
<div style="background:teal;"><h2>Registraion Form<br></h2></div><hr size="10"color="red"width="600">
</center>
<form>
<fieldset>
<legend><h5>Personal  Details</h5></legend>
<table width="100%" cellpadding="10px">
<tr>
<td>Applicant's full name </td>
<td>
<select >
<option>--Select --</option>
<option>Mr.</option>
<option>Ms.</option>
<option>Others</option>
</select>
<input type="text" size="20"/>
</td>
<td>Care Of </td>
<td><label>Parents</label><input type="radio" name="care" checked/><label>Guardian </label><input type="radio" name="care"/></td>
</tr>
<tr>
<td>Father's Name </td>
<td>
<select disabled >
<option>Mr.</option>
</select>
<input type="text" size="20"/>
</td>
<td>Mother's Name </td>
<td>
<select disabled >
<option>Mrs.</option>
</select>
<input type="text" size="20"/>
</td>
</tr>
<tr>
<td>Gender</td> 
  

<td>
<label>Male</label><input type="radio" name="Gender"/>
<label>Female </label><input type="radio" name="Gender"/>
<label>Others </label><input type="radio" name="Gender"/>
</td>
<td>Date of Birth</td>
<td>
<input type="date"/>
</td>
</tr>
<tr>
<td>Marital Status</td>
<td>
<select>
<option>--Select--</option>
<option>Single</option>
<option>Married</option>
<option>Divorced</option>
<option>Widowed</option>
</select>
</td>
<td>Category </td>
<td>
<select>
<option>--Select--</option>
<option>General</option>
<option>OBC</option>
<option>SC</option>
<option>ST</option>
</select>
</td>
</tr>
<tr>
<td>Handicapped </td>
<td><label>No</label><input type="radio" name="Handicapped" checked/><label>Yes</label><input type="radio" name="Handicapped"/></td>
<td>Ex-Serviceman </td>
<td><label>No</label><input type="radio" name="Serviceman" checked/><label>Yes</label><input type="radio" name="Serviceman"/></td>
</tr>
<tr>
<td>EWS </td>
<td><label>No</label><input type="radio" name="EWS" checked/><label>Yes</label><input type="radio" name="EWS"/></td>
<td>Religion </td>
<td>
<select>
<option>--Select--</option>
<option>Hindu</option>
<option>Muslim</option>
<option>Jain</option>
<option>Christianity</option>
</select>
</td>
</tr>
</table>
</fieldset><br>
<fieldset>
<legend><h5>Contact Details</h5></legend>
<table width="100%" cellpadding="10px">
<tr>
<td>Mobile Number</td>
<td><input type="tel"/></td>
<td>Email ID</td>
<td><input type="email"/></td>
</tr>
<tr>
<td>Address Line 1</td>
<td><input type="text"/></td>
<td>Address Line 2</td>
<td><input type="text"/></td>
</tr>
<tr>
<td>City</td>
<td><input type="text"/></td>
<td>State</td>
<td>
<select>
<option>--Select--</option>
<option value="Andhra Pradesh">Andhra Pradesh</option>
<option value="Andaman and Nicobar Islands">Andaman and Nicobar Islands</option>
<option value="Arunachal Pradesh">Arunachal Pradesh</option>
<option value="Assam">Assam</option>
<option value="Bihar">Bihar</option>
<option value="Chandigarh">Chandigarh</option>
<option value="Chhattisgarh">Chhattisgarh</option>
<option value="Dadar and Nagar Haveli">Dadar and Nagar Haveli</option>
<option value="Daman and Diu">Daman and Diu</option>
<option value="Delhi">Delhi</option>
<option value="Lakshadweep">Lakshadweep</option>
<option value="Puducherry">Puducherry</option>
<option value="Goa">Goa</option>
<option value="Gujarat">Gujarat</option>
<option value="Haryana">Haryana</option>
<option value="Himachal Pradesh">Himachal Pradesh</option>
<option value="Jammu and Kashmir">Jammu and Kashmir</option>
<option value="Jharkhand">Jharkhand</option>
<option value="Karnataka">Karnataka</option>
<option value="Kerala">Kerala</option>
<option value="Madhya Pradesh">Madhya Pradesh</option>
<option value="Maharashtra">Maharashtra</option>
<option value="Manipur">Manipur</option>
<option value="Meghalaya">Meghalaya</option>
<option value="Mizoram">Mizoram</option>
<option value="Nagaland">Nagaland</option>
<option value="Odisha">Odisha</option>
<option value="Punjab">Punjab</option>
<option value="Rajasthan">Rajasthan</option>
<option value="Sikkim">Sikkim</option>
<option value="Tamil Nadu">Tamil Nadu</option>
<option value="Telangana">Telangana</option>
<option value="Tripura">Tripura</option>
<option value="Uttar Pradesh">Uttar Pradesh</option>
<option value="Uttarakhand">Uttarakhand</option>
<option value="West Bengal">West Bengal</option>
</select>
</td>
</tr>
<tr>
<td>Pin Code</td>
<td><input type="text"/></td>
</tr>
</table>
</fieldset><br>
<fieldset>
<legend><h5>Qualification Details</h5></legend>
<table width="100%" cellpadding="10px">
<tr>
<th>Sr No.</th>
<th>Qualification</th>
<th>Board/University</th>
<th>Passing Year</th>
<th>Max Marks</th>
<th>Marks Obtain</th>
<th>Percentage</th>
</tr>
<tr>
<td>1</td>
<td>
<select>
<option>--Select--</option>
<option>10th</option>
<option>12th</option>
<option>Graduate</option>
<option>Post Graduate</option>
</select>
</td>
<td>
<input type="text"/>
</td>
<td>
<input type="number" min="1990" max="2022"/>
</td>
<td>
<input type="number" min="0" max="10000"/>
</td>
<td>
<input type="number" min="0" max="10000"/>
</td>
<td>
<input type="number" min="0" max="100"/>
</td>
</tr>
<tr>
<td>2</td>
<td>
<select>
<option>--Select--</option>
<option>10th</option>
<option>12th</option>
<option>Graduate</option>
<option>Post Graduate</option>
</select>
</td>
<td>
<input type="text"/>
</td>
<td>
<input type="number" min="1990" max="2022"/>
</td>
<td>
<input type="number" min="0" max="10000"/>
</td>
<td>
<input type="number" min="0" max="10000"/>
</td>
<td>
<input type="number" min="0" max="100"/>
</td>
</tr>
<tr>
<td>3</td>
<td>
<select>
<option>--Select--</option>
<option>10th</option>
<option>12th</option>
<option>Graduate</option>
<option>Post Graduate</option>
</select>
</td>
<td>
<input type="text"/>
</td>
<td>
<input type="number" min="1990" max="2022"/>
</td>
<td>
<input type="number" min="0" max="10000"/>
</td>
<td>
<input type="number" min="0" max="10000"/>
</td>
<td>
<input type="number" min="0" max="100"/>
</td>
</tr>
<tr>
<td>4</td>
<td>
<select>
<option>--Select--</option>
<option>10th</option>
<option>12th</option>
<option>Graduate</option>
<option>Post Graduate</option>
</select>
</td>
<td>
<input type="text"/>
</td>
<td>
<input type="number" min="1990" max="2022"/>
</td>
<td>
<input type="number" min="0" max="10000"/>
</td>
<td>
<input type="number" min="0" max="10000"/>
</td>
<td>
<input type="number" min="0" max="100"/>
</td>
</tr>
</table>
</fieldset><br>
<fieldset>
<legend><h5>Language Knowledge</h5></legend>
<table width="100%">
<tr>
<td>Language</td>
<td>Reading</td>
<td>Writing</td>
<td>Spoken</td>
</tr>
<tr>
<td>Hindi</td>
<td><input type="checkbox"/></td>
<td><input type="checkbox"/></td>
<td><input type="checkbox"/></td>
</tr>
<tr>
<td>English</td>
<td><input type="checkbox"/></td>
<td><input type="checkbox"/></td>
<td><input type="checkbox"/></td>
</tr>
<tr>
<td>Urdu</td>
<td><input type="checkbox"/></td>
<td><input type="checkbox"/></td>
<td><input type="checkbox"/></td>
</tr>
</table>
</fieldset><br>
<fieldset>
<legend><h5>Identification Details</h5></legend>
<table align="center">
<tr>
<td>Aadhar Card Number</td>
<td><input type="text" maxlength="12"/></td>
<td>PAN Card Number</td>
<td><input type="text" maxlength="9"/></td>
</tr>
<tr>
<td>Upload Photo</td>
<td><input type="file"/></td>
<td>Upload Signature</td>
<td><input type="file"/></td>
</tr>
</table>
</fieldset>
<br/>
<center>
<input type="submit" value="Submit"action="post"class="mybutton">&nbsp;&nbsp;&nbsp;
<input type="reset" value="Back"action="post"class="mybutton">
</center>
</form>
<address align="right">
        Written by <a href="mailto:itcihardoi@gmail.com">Satyam Trivedi</a>.<br> 
        Contact us at:<br>
        Head Post Office Road, Hardoi<br>
        India
    </address>
</body>
</html>