使用Visual?

Tags: 軟體, 圖片, 介面,

當我們看到別人美麗的登入軟體介面是不是很好奇,很想自己製作個,但是苦於自己不是專業程式設計人士。不過沒有關係,這篇文章同樣適合沒有任何程式設計經歷的人,本文章每關鍵步驟採用圖片的形式展現個大家,讓讀著清晰明瞭,最終實現可以登入的見面。實現的登入軟體介面如下:

使用Visual Studio怎樣製作登入介面

工具/原料

Visual Studio工具(我使用的是Visual Studio 2010)。

Icon圖片(非必選),簡潔的圖片

步驟/方法

開啟Visual Studio工具,工具介面如下(沒有使用過程式設計的朋友們可以看看):【】

使用Visual Studio怎樣製作登入介面

開啟【檔案】---【新建】---【專案】出現如下框:

使用Visual Studio怎樣製作登入介面

在出現的框中在框裡選擇window C# 再選擇windows窗體應用程式,在名稱裡輸入:MyStudentSys(我這裡要做高校學生管理系統),這個名字自己可以根據需要起,儘量要有意義,下面的位置是自己儲存專案檔案的的目錄,這裡我放在E盤。整體介面如下:

使用Visual Studio怎樣製作登入介面

點選確定後就出現了,第一個窗體程式,我們就是在這個窗體裡實現登入功能和製作美麗的登入介面,第一個form程式如下圖form1窗體:

使用Visual Studio怎樣製作登入介面

看到這是不是很失望,怎麼什麼都沒有,別急,我們就是在這什麼都沒有的窗體上新增我們自己需要的東西,首先我們修改下這個窗體的名稱改為:學生管理系統登入(修改的具體步驟在圖下面),再添加個Icon圖片,就是標題前面的圖片(圖下面有詳細的步驟),修改之前需要開啟form1窗體的屬性,步驟:右鍵點選,點選屬性,就會出現屬性框如下圖:看到這個框就找到了,窗體程式的屬性,我們很多地方要使用這裡,修改標題的步驟,找到Text屬性就是上面圖片藍色的部分,把form1改為:學生管理系統登入。找到Icon 在其後點選,選擇我們事先準備好的ICON圖片(非必須,軟體預設的也有,為了美觀自己可以新增修改)修改好後我們就實現瞭如下的介面。

使用Visual Studio怎樣製作登入介面

使用Visual Studio怎樣製作登入介面

好了簡單的介面就這做好了,剩下就是新增我們需要的東西了,並且實現登入功能,這需要使用控制元件,在軟體左邊開啟工具箱,如果找不到,就點選軟體檢視,找到工具箱,點選就可以出現了。我們主要使用這幾個控制元件 button(按鈕控制元件),label(標籤),textbox(文字框),combobox(組合框)這些控制元件在工具箱可以找到,工具箱如下圖:

使用Visual Studio怎樣製作登入介面

點選選擇label(標籤)把他拖到form1窗體裡合適的位置,然後在屬性框裡找到txet在其後把label1修改為:登入名,同理再拖2個標籤控制元件,分明把Text屬性值修改為: 密碼,登入型別,再在工具箱裡拖兩個textbox到form1窗體合適的位置,同理再拖combobox空間到窗體裡,最後實現如下的效果,如果沒有實現就在工具箱裡看看選擇的控制元件對不對,別忘了把標籤(label)的TEXT屬性值改為漢字,還有buttn 按鈕的控制元件Text也要改為漢字,即登入和取消。如果標籤(label)有背景顏色,找到backcolor屬性修改為無色,控制元件的大小自己可以拖動,設為自己看著合適美觀的效果,最後修改顯示的效果如下圖:

使用Visual Studio怎樣製作登入介面

是不是發現和最上面做好的相比沒有標題,我們可以再從工具箱裡託一個label 表填,在Text屬性裡輸入:高校學生管理系統, 把文字設為大一點,設定字型可以找到屬性font 點選選擇相應的大小和字型型別,最後實現如下圖的效果:

使用Visual Studio怎樣製作登入介面

介面做好了,點選軟體的執行除錯按鈕看看效果:軟體執行按鈕:執行後,看看是不是彈出一個登入框,但是你點選登入是不是沒有反應,別急,現在還沒有給窗體寫事件,執行結果如圖:

使用Visual Studio怎樣製作登入介面

使用Visual Studio怎樣製作登入介面

點選關閉,點選選單欄 【除錯】--觀察下是否還在除錯,如果在除錯,就停止除錯,截下來我們要寫事件了,就是要實現登入的功能,首先再重新建立一個主視窗,就是等會我們登入成功了要跳轉到那個主窗體,登入窗體關閉。建立主窗體步驟:在視圖裡找到解決方案資源管理器,右擊解決方案MyStudentSys ,點選新增,再點選新建項,選擇Visual C#項,選擇window窗體,點選確定就好了,有建立一個窗體,在窗體裡隨便拖進今個控制元件,驗證等下我們是否登入進來,如下如下圖:

使用Visual Studio怎樣製作登入介面

等下如果登入成功就進入這個窗體介面,不成功,不讓登入,現在雙擊點選登入介面的登入按鈕,後顯示如下如,並在程式碼 { } 裡寫入下面的程式碼:
string name = "admin";
string pass = "0000";
if(name==textBox1.Text.Trim()&&pass==textBox2.Text.Trim())
{
Form2 form=new Form2();
form.Show();
this.Hide();

點選執行除錯看看,在輸入框裡登入名輸入 admin 密碼 :0000點選登入看能不能進入,Ok ,我測試成功。

下面我們建立 取消 按鈕時間,即點選取消,就退出程式。雙擊取消按鈕,在{} 裡寫上下面的程式碼:Application.Exit(); 如下圖

使用Visual Studio怎樣製作登入介面

點選執行測試下。OK,可以呼叫主窗體,如果沒有呼叫,看看是不是程式碼寫錯了,重新檢查下。就這樣,一個美麗的登入介面和實現登入的功能就實現了,這只是簡單的功能,更多的功能自己接觸控索下軟體,慢慢體會,時間長了,就摸索出來了。

相關問題答案