Archive for 2020

C# - Login And Register Form Design

Add Comment

How To Design a Login And Register Form In C#

C# Login And Register Form Design


in this c# form design tutorial we will see how to design a login and register form in one  windowForm using csharp programming language .

tools:
- c# programming language.
- microsoft visual studio express 2013.
- iconsdb.com ( to get the close icon).
- canva.com ( to create the app logo ).
- flatuicolorpicker.com ( for color ideas ).

Watch This Full Demo



- The Project Source Code

we will add two buttons and two panels to the form, inside the panels we will add the textboxes and buttons to login and register, and the two buttons will help us to go between the two panels.

c# login form design


c# register form design
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace csharp_LoginRegister_Design
{
    public partial class LoginAndRegisterForm : Form
    {
        public LoginAndRegisterForm()
        {
            InitializeComponent();
        }

        private void Form1_Load(object sender, EventArgs e)
        {
            button_GoToLogin.PerformClick();
        }

        Color select_color = Color.FromArgb(49, 46, 46);

        private void button_GoToLogin_Click(object sender, EventArgs e)
        {
            panel_login.BringToFront();
            panel_login_bar.BackColor = Color.Yellow;
            panel_register_bar.BackColor = select_color;
            button_GoToLogin.BackColor = select_color;
            button_GoToRegister.BackColor = Color.Black;
        }

        private void button_GoToRegister_Click(object sender, EventArgs e)
        {
            panel_register.BringToFront();
            panel_register_bar.BackColor = Color.Yellow;
            panel_login_bar.BackColor = select_color;
            button_GoToRegister.BackColor = select_color;
            button_GoToLogin.BackColor = Color.Black;
        }

        private void pictureBox_close_Click(object sender, EventArgs e)
        {
            this.Close();
        }
    }
}

VB.Net Import Txt File Text To DataGridview

Add Comment

How To Populate DataGridview From a Text File Data In VB.Net

display txt file text to a datagridview using vb.net
In this VB.NET Tutorial we will see How To Get Records From .txt File And Display The Values Into DataGridView Rows On Button Click Event Using Visual Basic.Net  Programming Language And Visual  Studio Editor.


Project Source Code:


Imports System.IO

Public Class TXT_TO_DGV

    Dim table As New DataTable()
    Private Sub TXT_TO_DGV_Load(sender As Object, e As EventArgs) Handles MyBase.Load

        ' add columns to datatable
        table.Columns.Add("Id", Type.GetType("System.Int32"))
        table.Columns.Add("First Name", Type.GetType("System.String"))
        table.Columns.Add("Last Name", Type.GetType("System.String"))
        table.Columns.Add("Age", Type.GetType("System.Int32"))

        ' set the datatable as datasource
        DataGridView1.DataSource = table

    End Sub

    ' button import
    Private Sub ButtonImport_Click(sender As Object, e As EventArgs) Handles ButtonImport.Click

        Dim lines() As String
        Dim vals() As String
      
        ' get lines from the text file
        lines = File.ReadAllLines("C:\Users\1BestCsharp\Desktop\table.txt")

        For i As Integer = 0 To lines.Length - 1 Step +1  ' lines

            vals = lines(i).ToString().Split("|")
            Dim row(vals.Length - 1) As String

            For j As Integer = 0 To vals.Length - 1 Step +1  ' columns

                row(j) = vals(j).Trim()

            Next j

            table.Rows.Add(row)

        Next i


    End Sub
End Class


OutPut:

Import Text File Text To DataGridview Using VB.Net

C# Real Estate Management System Source Code

Add Comment

Real Estate Management System Project Source Code Using C# And MySQL Database

C# Real Estate Management System Project

in this c# complete project tutorial serie we will see how to create a real estate management system using windowForm in c# programming language and mysql database.

goals of this project:
- give students / curious persons an example so they can learn from it.
- helping people create their first project. 
- sharing knowledge with others.

tools:
- c# programming language.
- microsoft visual studio express 2013.
- mysql database.
- phpmyadmin.
- xampp server.
- pixabay.com ( website for free images ).

Watch This Full Demo




1 - The Login Form

the login form will allow the Users to login into the Real-Estate application Main Form.
the user need to enter his username and password before clicking the login button.
login form
if the user let the username or password empty an astrix will show up in the right side of the textbox.
login form 2

if the user enter wrong username or password an error message will show up telling him what's the problem.
login form 3
and if everything is ok, when the user click on the login button the main real estate management system form will show up and the login form will closed.


2 - The Real Estate System Main Project Form

after the user successfully login, he will see this main app window with a menu using panel and buttons.
the user can select where he want to go by clicking the on the item from the menu.

main form


menu
Menu Item Hover


3 - The Real Estate System , Clients Form


- this form contains a datagridview with all clients data, a label with total clients in the database.

- to add a new client enter his data and click on "Add" button.

- to edit a client you need to select him first from the datagridview and enter his new data.

- when you want to delete a client just select the client you want to remove and click on the "Remove" button.
- when you Add or Remove a client the label with clients count will be updated automatically.

manage clients form

4 - The Real Estate System Manage Owners Form


this form is 90% like the clients form

you can add, edit, remove selected owner and all the good stuff.

manage owners form

if you want to see a selected owner properties, just select the owner from the datagridview and click the "Show This Owner's Properties" button.

and you can see a label with total of properties this owner have.


owner properties

5 - The Real Estate System - Property's Types Form


in this form the user can manage the types of properties in the system.
all types are displayed in a listbox, if you select an item from the listbox it will be displayed on the textboxes.



property types

property types 2

6 - The Real Estate System , Property Form


this form contains textboxes, numericUpDown for the numeric values, checkboxes for the property features, a combobx populated  with all types,
manage property form
in this form the user can add, edit, search and remove a property.
when the user want to add/edit a property he need to select an owner for this property, and he can do that by clicking on the "Select Owner" button and a form will show allowing him to select an owner.
owners list

 if the user want to search for a property all he need to do is to enter the property's id and click on the "search" button.
each property need to be assigned to a type, which can be selected form the combobox.

search property


if the user can see the selected property images by clicking on the "Show This Property Images".
property images
if the user want to see all properties list by clicking on the "Show All Properties" button .
owners properties list

7 - The Real Estate System , Property's Images Form


in this form the user can see all properties displayed in a datagridview, and all types on a listbox.
manage property images

 if the user select a type from the listbox => all properties in this type will be displayed in the datagridview.


when you select a property from the datagridview => all this property's images id will be displayed in another listbox => and when you select an item from the list the image will show up in a pictureBox.




the user can browse a photo from his computer and add it to the selected property.
the user can remove the selected image by selecting it from the listbox.
there is no edit image, just add and remove.
manage property images 2

 when you click on the "Show This Property Images" a form will show up with a SlideShow to display the images and two buttons to navigate.
property images slider

8 - The Real Estate System , Sales Form


in this form the user can manage the properties sales.
this form contains 3 tables:
1 - display the clients.
2 - display the properties.
3 - display the sales.
and you can add, edit remove the selected sale.
property sale form
properties sales form

 to display only the properties sold the user need to click on the "Properties Sold". 
properties sold

 to display only the properties NOT sold the user need to click on the "Properties Not Sold". 
properties not sold

 to display ALL the properties the user need to click on the "All Properties". 

all properties

if you want the source code click on the download button below

Java - Login And Dashboard Form Design

2 Comments

How To Design Login And Dashboard Form In Java Using NetBeans

Design Login And Dashboard Form In Java Netbeans
In this Java Tutorial we will see How To Design A Login Form And A Dashboard Form 
In Java NetBeans .

In This Java Swing Design Tutorial We Will Use:
- Java Programming Language.
- Netbeans IDE.
- flatuicolorpicker.com = to get flat colors.
- iconsdb.com = to get icons.
- canva.com = to get the app logo.



Project Description And Source Code:

1 - The Login Form

        // display the login form in the center of the screen
        this.setLocationRelativeTo(null);
        
        // set icons
        jLabel_close.setIcon(new javax.swing.ImageIcon(getClass().getResource("../IMAGES/x.png")));
        jLabel_user.setIcon(new javax.swing.ImageIcon(getClass().getResource("../IMAGES/user.png")));
        jLabel_pass.setIcon(new javax.swing.ImageIcon(getClass().getResource("../IMAGES/lock.png")));
        jLabel_showPass.setIcon(new javax.swing.ImageIcon(getClass().getResource("../IMAGES/eye.png")));
        jLabel_up.setIcon(new javax.swing.ImageIcon(getClass().getResource("../IMAGES/up.png")));
        
        // set borders
        Border panelBorder = BorderFactory.createMatteBorder(0, 0, 0, 5, Color.black);
        jPanel_container.setBorder(panelBorder);
        
        Border titleBorder = BorderFactory.createMatteBorder(0, 0, 4, 0, Color.gray);
        jLabel_title.setBorder(titleBorder);    

Java Login Form Design

// checkbox to show and hide the password    
private void jCheckBox_showPassActionPerformed(java.awt.event.ActionEvent evt) {                                                   
        // show password chars
        if(jCheckBox_showPass.isSelected())
        {
            jPasswordField_password.setEchoChar((char)0);
        }
        // hide password chars
        else
        {
            jPasswordField_password.setEchoChar('*');
        }
    }


Java Login Form Design

// jlabel to close the form
    private void jLabel_closeMouseClicked(java.awt.event.MouseEvent evt) {                                          
        // close this form
        this.dispose();
        
    } 

    // timer to hide the message panel
    Timer timerUp = new Timer(10, new ActionListener() {
        @Override
        public void actionPerformed(ActionEvent e) {
            
            if(jPanel_message.getHeight() != 0)
            {
               jPanel_message.setBounds(jPanel_message.getX(), jPanel_message.getY(), jPanel_message.getWidth(), jPanel_message.getHeight() - 5);
            }
            else
            {
                timerUp.stop();
            }
        }
    });
    
    // timer to show the message panel
    Timer timerDown = new Timer(10, new ActionListener() {
        @Override
        public void actionPerformed(ActionEvent e) {
            
            if(jPanel_message.getHeight() != 60)
            {
               jPanel_message.setBounds(jPanel_message.getX(), jPanel_message.getY(), jPanel_message.getWidth(), jPanel_message.getHeight() + 5);
            }
            else
            {
                timerDown.stop();
            }
        }
    });

Java Login Form Design

// the login button
    private void jButton_loginActionPerformed(java.awt.event.ActionEvent evt) {                                            
        // get values
        String username  = jTextField_username.getText().trim();
        String password = String.valueOf(jPasswordField_password.getPassword()).trim();
        
         // if the username is empty
        if(username.equals(""))
        {
            jLabel_message_text.setText("Enter Your Username First");
        }

        // if the password is empty
        else if(password.equals(""))
        {
           jLabel_message_text.setText("You Need To Enter Your Password"); 
        }

        // if everything is ok
        else if(username.equals("admin") && password.equals("pass123"))
        {
           this.dispose();
           Dashboard_Form dashboard = new Dashboard_Form();
           dashboard.setVisible(true);
        }
        
        // if the username or password are incorrect
        else
        {
           jLabel_message_text.setText("Incorrect Username or Password");  
        }
        
        // show the jpanel message
        timerDown.start();
        
    }

Java Login Form Design

2 - The Dashboard Form


    // default border for the menu items
    Border default_border = BorderFactory.createMatteBorder(1, 0, 1, 0, new Color(46,49,49));
        
    // yellow border for the menu items
    Border yellow_border = BorderFactory.createMatteBorder(1, 0, 1, 0, Color.YELLOW);
    
    // create an array of jlabels
    JLabel[] menuLabels = new JLabel[7];
    
    // create an array of jpanels
    JPanel[] panels = new JPanel[7];


//-------- inside the dashboard form constructor ----------//

        // center this form
        this.setLocationRelativeTo(null);
        
        // set icons
        jLabel_appLogo.setIcon(new javax.swing.ImageIcon(getClass().getResource("../IMAGES/appLogo.png")));
        jLabel_close.setIcon(new javax.swing.ImageIcon(getClass().getResource("../IMAGES/x.png")));
        
        
        // set borders
        // panel logo border
        Border panelBorder = BorderFactory.createMatteBorder(0, 0, 2, 0, Color.lightGray);
        jPanel_logoANDname.setBorder(panelBorder);
        // panel container border
        Border containerBorder = BorderFactory.createMatteBorder(1, 1, 1, 1, new Color(46,49,49));
        jPanel_container.setBorder(containerBorder);
        
        // populate the menuLabels array
        // you can use a for loop to do that
        menuLabels[0] = jLabel_menuItem1;
        menuLabels[1] = jLabel_menuItem2;
        menuLabels[2] = jLabel_menuItem3;
        menuLabels[3] = jLabel_menuItem4;
        menuLabels[4] = jLabel_menuItem5;
        menuLabels[5] = jLabel_menuItem6;
        menuLabels[6] = jLabel_menuItem7;
        
        // populate the panels array
        panels[0] = jPanel_dashboard;
        panels[1] = jPanel_users;
        panels[2] = jPanel_products;
        panels[3] = jPanel_settings;
        panels[4] = jPanel_contact;
        panels[5] = jPanel_calendar;
        panels[6] = jPanel_test;
        
        // call this function to add actions to all menu items
        addActionToMenuLabels();

//-----------------------------------------------------------//

// label close this form
    private void jLabel_closeMouseClicked(java.awt.event.MouseEvent evt) {                                          
        // close this form
        this.dispose();

    }


    // create a function to set the label background color
    public void setLabelBackround(JLabel label)
    {
        // reset labels to their default design
        for (JLabel menuItem : menuLabels)
        {
           // change the jlabel background color to white
           menuItem.setBackground(new Color(46,49,49));
           // change the jlabel Foreground color to blue
           menuItem.setForeground(Color.white); 
        }
        
        // change the jlabel background color to white
        label.setBackground(Color.white);
        // change the jlabel Foreground color to blue
        label.setForeground(Color.blue);
    }
    

// create a function to show the selected panel
    public void showPanel(JPanel panel)
    {
        // hide panels
        for (JPanel pnl : panels) 
        {
            pnl.setVisible(false);
        }
        
        // and show only this panel
        panel.setVisible(true);
    }


// create a function to add actions to all menu labels
    public void addActionToMenuLabels()
    {
        // get labels in the jpanel menu
        Component[] components = jPanel_menu.getComponents();
        
        for (Component component : components) {
            if(component instanceof JLabel)
            {
                JLabel label = (JLabel) component;
                
                 // add action to the labels
                label.addMouseListener(new MouseListener() {
                    @Override
                    public void mouseClicked(MouseEvent e) {
                        
                          // when we click on the jlabel
                        // change the jlabel background and Foreground
                       // using setLabelBackround function we created
                        setLabelBackround(label);
                        
                        // display the selected panel depending on the selected label
                       // using the showPanel function
                        switch (label.getText().trim()){
                            case "Dashboard":
                                   showPanel(jPanel_dashboard);
                                   break;
                                   
                            case "Users":
                                   showPanel(jPanel_users);
                                   // jPanel_users.setBackground(Color.red);
                                   break;
                                   
                            case "Products":
                                   showPanel(jPanel_products);
                                   // jPanel_products.setBackground(Color.BLUE);
                                   break;
                                   
                                   case "Settings":
                                   showPanel(jPanel_settings);
                                   // jPanel_settings.setBackground(Color.GRAY);
                                   break;
                                   
                                   case "Contact":
                                   showPanel(jPanel_contact);
                                   // jPanel_contact.setBackground(Color.GREEN);
                                   break;
                                   
                                   case "Calendar":
                                   showPanel(jPanel_calendar);
                                   // jPanel_calendar.setBackground(Color.yellow);
                                   break;
                                   
                                   case "Test":
                                   showPanel(jPanel_test);
                                   // jPanel_test.setBackground(Color.orange);
                                   break;
                                   
                        }
                        
                      }

                    @Override
                    public void mousePressed(MouseEvent e) {
                     }

                    @Override
                    public void mouseReleased(MouseEvent e) {
                      }

                    @Override
                    public void mouseEntered(MouseEvent e) {
                        // on the mouse entred event
                        // set the border to yellow
                        label.setBorder(yellow_border);
                        
                      }

                    @Override
                    public void mouseExited(MouseEvent e) {
                        // on the mouse exited event
                        // reset to the default border
                        label.setBorder(default_border);
                        
                      }
                });
                
            }
        }
    }




Inscription à : Articles (Atom)