TWI647618B - 程式語言編輯方法 - Google Patents

程式語言編輯方法 Download PDF

Info

Publication number
TWI647618B
TWI647618B TW106136979A TW106136979A TWI647618B TW I647618 B TWI647618 B TW I647618B TW 106136979 A TW106136979 A TW 106136979A TW 106136979 A TW106136979 A TW 106136979A TW I647618 B TWI647618 B TW I647618B
Authority
TW
Taiwan
Prior art keywords
editing
function
variable
programming language
pane
Prior art date
Application number
TW106136979A
Other languages
English (en)
Other versions
TW201917572A (zh
Inventor
徐易聖
Original Assignee
易易資設有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 易易資設有限公司 filed Critical 易易資設有限公司
Priority to TW106136979A priority Critical patent/TWI647618B/zh
Priority to CN201711246896.1A priority patent/CN109710225A/zh
Application granted granted Critical
Publication of TWI647618B publication Critical patent/TWI647618B/zh
Publication of TW201917572A publication Critical patent/TW201917572A/zh

Links

Landscapes

  • Stored Programmes (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本發明提供一種程式語言編輯方法,係提供一編輯介面,其中包括語法選擇窗格及語法編輯窗格,在語法選擇窗格中顯示代表一變數或一函式的選擇標籤及其語義說明,供使用者由語法選擇窗格選擇並點擊欲使用的變數或函式,將變數或函式顯示於語法編輯窗格進行進一步編輯,藉此,本發明可於使用者點擊選擇變數或函式或進一步編輯的同時,顯示程式語言的語法以及語義,供使用者察看,有助於使用者熟悉程式語言的內容,可隨時察看並快速理解先前編輯過的程式語言內容,提高使用者學習、理解程式語言的效率,降低學習挫折感。

Description

程式語言編輯方法
本發明是關於一種程式語言編輯方法。
程式語言是用來定義電腦程式的形式語言,用來向電腦發出指令。程式語言的描述可以分為語法及語義,語法是指程式語言中,哪些符號或文字的組合方式是正確的,而語義則是對於程式語言的解釋。
目前已有許多程式語言編輯器可輔助程式語言設計師編輯程式語言,這些程式語言編輯器可提供例如語法高亮、語法折疊、關鍵詞自動完成、尋找、取代、拼寫檢查、代碼一致性檢查等功能,也就是說,既有的程式語言編輯器多是用來輔助設計師以正確的「語法」編輯程式語言,但並不特別對程式語言的「語義」進行說明。
然而,許多程式語言的初學者不但對於程式語言的「語法」還不熟悉,甚至也無法完全理解程式語言的「語義」,因此既有程式語言編輯器對於程式語言初學者仍是不夠友善的,經常讓程式語言初學者感到挫折。
本發明的主要目的在於提供一種可對使用者提示語義及語法格式的程式語言編輯方法。
為了達成上述及其他目的,本發明提供一種程式語言編輯方法,包括:提供一編輯介面,該編輯介面包括一語法選擇窗格及一語法編輯窗格,該語法選擇窗格顯示多個分別代表一變數或一函式的選擇標籤及其語義說明;所述選擇標籤受點擊後,該語法編輯窗格顯示一對應所述變數或函式的變數/函式編輯窗,該變數/函式編輯窗包括一對應所述變數或函式的變數/函式格式區及一對應該變數/函式格式區的程式語言區,該變數/函式格式區顯示所述變數或函式所對應的格式並包括至少一輸入欄位;自所述輸入欄位接收一輸入值;該程式語言區根據所述變數或函式的格式及該輸入值顯示一相對應的程式語言。
基於上述設計,使用者在編輯程式語言的過程中,可在編輯介面同時讀到程式語言、其語法格式以及其語義說明,且程式語言及語法格式是匹配顯示,相較於既有程式語言編輯器僅單獨顯示程式語言,本發明的設計可允許使用者在編輯完多組變數/函式之後,更輕易地理解先前編輯過的變數/函式所對應的格式及其語義,從而有助於程式編輯初學者學習、理解程式語言的編輯作業,降低其學習挫折感。
本實施例提供一種程式語言編輯方法,如第1圖所示,是以電子計算機運行電腦程式產品,並由螢幕或類似裝置顯示其編輯介面,供使用者操作電子計算機執行程式語言編輯方法,編輯並撰寫程式語言,於使用者操作電子計算機時,依電子計算機的種類不同,使用者可能以滑鼠、鍵盤、觸控板、觸控螢幕或其他輸入/輸出裝置進行操作。
執行本實施例之程式語言編輯方法,包括提供一編輯介面,如第1圖所示,該編輯介面包括一語法選擇窗格10及一語法編輯窗格20,語法選擇窗格10顯示可供使用者選擇使用的程式語言語法,具體而言包括多個分別代表一變數或一函式的選擇標籤11及其語義說明12,其中變數與函式均為以特定組合方式排列的符號,每一個變數中都不含其他變數或函式,但一個函式中則可能含有其他變數或函式;選擇標籤11與語義說明12之內容係彼此匹配,語義說明12中的內容可提示並說明對應之選擇標籤11中顯示的變數或函式的意義或內容,供使用者點擊選擇標籤11選用,其中,所編輯的程式語言可能具有多種不同的變數與函式,為了方便使用者快速找到欲使用的目標,語法選擇窗格中可以進一步包括多個以功能、類型進行分類的頁籤13,例如第1圖中的變數頁籤與函式頁籤,每一頁籤可分別對應若干選擇標籤11及其語義說明,這些頁籤13將語法選擇窗格10中可顯示的選擇標籤11及其語義說明12分類,使語法選擇窗格10中一次僅顯示一部分的選擇標籤11。
語法編輯窗格20顯示使用者目前已編輯撰寫或即將編輯的程式語言,供使用者瀏覽並進一步編輯。在使用者尚未點擊選擇標籤11的情形下,如第1圖所示,語法編輯窗格20僅有顯示一預設輸入區21。
請參考第2圖,使用者點擊其中一個選擇標籤11,例如在本實施例中點擊代表變數宣告的選擇標籤11,語法編輯窗格20即在原先顯示預設輸入區21處顯示一對應選擇標籤11的變數/函式編輯窗22,預設輸入區則排列顯示於變數/函式編輯窗22下方,該變數/函式編輯窗22包括一對應所述變數或函式的變數/函式格式區221及一對應該變數/函式格式區的程式語言區222,另外,該變數/函式編輯窗22還包括有一新增標籤223。變數/函式格式區221顯示對應選擇標籤11的變數或函式所對應的格式,並包括一至多個輸入欄位224,輸入欄位224中預填有符合該輸入欄位224之語義的輸入值,該輸入值的形式可能是字串、數值、布林值、未定義、空值或其他可能的值,其中,變數或函式所對應的格式是依照使用者所欲編輯撰寫的程式語言種類進行定義,例如HTML、Java Script或其他種類之程式語言,使變數/函式格式區221中顯示的變數或函式對應的格式符合該種程式語言制式的格式規範或語法內容。請參考圖3,使用者點擊輸入欄位224時,編輯介面顯示一選單窗格30,該選單窗格30中載有多個分別對應一預設內容的預設內容標籤31,可供使用者點擊,當使用者點擊其中一個預設內容標籤31,如第4圖所示,受點擊之預設內容標籤31所對應的預設內容即被輸入並顯示於輸入欄位224。藉由輸入欄位224預填之輸入值或預設內容標籤31顯示的內容,可向使用者提示該輸入欄位224可填入的輸入值之格式。
請參考第4圖與第5圖,使用者除輸入欄位224預填之輸入值以及預設內容標籤31的內容之外,使用者也可以點擊輸入欄位224後,以鍵盤或類似裝置自行填入其他輸入值,讓輸入欄位224接收使用者自訂的輸入值,而無須受限於預設內容標籤31的內容。
請參考第5圖與第6圖,各個輸入欄位224均輸入設定完成後,使用者可點擊新增標籤223,程式語言區222即根據變數/函式格式區中顯示的變數或函式的格式以及輸入欄位224接收的輸入值顯示一相對應的程式語言。其中,程式語言區222所顯示的程式語言也可以是全部或局部(例如僅有對應於輸入欄位的部分)可供使用者編輯,使用者可以點擊程式語言區222中的程式語言,並以鍵盤或類似裝置直接鍵入的方式進行修改。
請參考第6圖與第7圖,使用者還可進一步點擊語法選擇窗格10的函式頁籤,並點擊其中代表建立函式的選擇標籤14,語法編輯窗格20即在原本顯示預設輸入區21處顯示選擇標籤14所對應的變數/函式編輯窗23,預設輸入區21則排列顯示於變數/函式編輯窗23下方,該變數/函式編輯窗23包括一對應所述變數或函式的變數/函式格式區231、一對應該變數/函式格式區的程式語言區232及一語法編輯子窗格233,變數/函式格式區231顯示對應選擇標籤14的變數或函式所對應的格式,並包括一至多個輸入欄位234,輸入欄位234中可以設定預填有符合該輸入欄位234之語義的輸入值。其中,程式語言區232根據變數或函式的格式及輸入欄位234的輸入值即時顯示編輯輸入的程式語言,當使用者點擊輸入欄位234並鍵入輸入值時,程式語言區232中顯示的程式語言即依使用者輸入的輸入值即時進行變更。語法編輯子窗格233位於程式語言區232中,使用者可點擊語法編輯子窗格233,如第8圖所示,預設輸入區21即改顯示於語法編輯子窗格233中,請參考第9圖,使用者可進一步點擊任意之選擇標籤,例如變數頁籤之選擇標籤11,語法編輯子窗格233即顯示對應選擇標籤11之變數或函式的變數/函式子編輯窗24,供使用者進一步編輯。
此外,使用者可於語法編輯窗格20中未顯示變數/函式編輯窗的任意位置點擊,例如任兩個變數/函式編輯窗之間,或是變數/函式編輯窗的下方,語法編輯窗格20即對應所點擊的位置顯示預設輸入區21,於使用者後續進一步點擊任意之選擇標籤時,於預設輸入區顯示對應於選擇標籤的變數/函式編輯窗。
請參考第9圖與第10圖,變數/函式編輯窗另外包括位移標籤225、235,例如是向上位移標籤,當使用者點擊位移標籤235時,載有該位移標籤的對應變數/函式編輯窗23與其他變數/函式編輯窗的相對位置將發生改變,例如是載有該位移標籤的變數/函式編輯窗23與其上方的變數/函式編輯窗22位置對調,使載有該位移標籤的變數/函式編輯窗23向上移動,可供使用者利用位移標籤225、235調整各個變數/函式編輯窗的排列順序。
請參考第9圖與第11圖,編輯介面另外包括一轉譯按鈕40,當使用者點擊該轉譯按鈕40,編輯介面即顯示一完整程式語言窗格50,語法編輯窗格20中所有變數/函式編輯窗22、23中顯示的程式語言依序顯示於完整程式語言窗格50,即完成程式語言之編輯,使用者可點擊並點選完整程式語言窗格50中所顯示的內容,予以複製或轉存進行利用。
除上述實施例外,本發明還可於選擇標籤11或頁籤13處另外設置一自訂標籤,於使用者點擊後產生並顯示供使用者輸入的介面,以將使用者輸入的內容儲存為另一新增的選擇標籤,或者可於使用者點擊後將使用者預先於語法編輯窗格中圈選的內容儲存或將語法編輯窗格中的全部內容儲存,新增為另一選擇標籤,提供使用者自訂與新增選擇標籤的使用功能。
利用上述內容,本發明提供一種程式語言編輯方法,使用者可以利用滑鼠或類似之操作介面進行點擊操作,點選需要使用的變數與函式,利用編輯介面直接顯示出正確完整的語法,可減少輸入錯誤或缺漏符號所造成的程式語言編輯錯誤,協助使用者編輯並撰寫程式語言。
其次,本發明於編輯介面中,同時顯示程式語言、語法格式及其語義說明,並且於變數與函式的輸入欄位中提供預設的輸入內容,能提示使用者當前使用的變數與函式在程式語言中所代表的語義,於使用者編輯的過程中也可以快速回顧並瞭解先前撰寫的程式語言的意義,協助使用者產生關連性的記憶,可降低程式語言的初學者於學習時遭遇的學習門檻,減輕挫折,而有助於快速學習程式語言。
綜上所述,本發明程式語言編輯方法不僅能直接幫助使用者完成程式語言所需的語法,在語義層面上也能給予使用者相當程度的提示與協助,可提高程式語言的編輯與學習效率,實為實務業界與學界所企盼,惟以上實施例僅用以說明本發明之技術內容,非用以限制本發明之申請專利範圍,本發明之專利範圍應以後述的申請專利範圍為準。
10‧‧‧語法選擇窗格
11‧‧‧選擇標籤
12‧‧‧語義說明
13‧‧‧頁籤
14‧‧‧選擇標籤
20‧‧‧語法編輯窗格
21‧‧‧預設輸入區
22‧‧‧變數/函式編輯窗
221‧‧‧變數/函式格式區
222‧‧‧程式語言區
223‧‧‧新增標籤
224‧‧‧輸入欄位
225‧‧‧位移標籤
23‧‧‧變數/函式編輯窗
231‧‧‧變數/函式格式區
232‧‧‧程式語言區
233‧‧‧語法編輯子窗格
234‧‧‧輸入欄位
235‧‧‧位移標籤
30‧‧‧選單窗格
31‧‧‧預設內容標籤
40‧‧‧轉譯按鈕
50‧‧‧完整程式語言窗格
第1圖為本發明程式語言編輯方法之編輯介面示意圖。
第2圖至第11圖為本發明程式語言編輯方法之連續操作示意圖。

Claims (10)

  1. 一種程式語言編輯方法,包括:提供一編輯介面,該編輯介面包括一語法選擇窗格及一語法編輯窗格,該語法選擇窗格顯示多個分別代表一變數或一函式的選擇標籤及其語義說明;所述選擇標籤受點擊後,該語法編輯窗格顯示一對應所述變數或函式的變數/函式編輯窗,該變數/函式編輯窗包括一對應所述變數或函式的變數/函式格式區及一對應該變數/函式格式區的程式語言區,該變數/函式格式區顯示所述變數或函式所對應的格式並包括至少一輸入欄位;自所述輸入欄位接收一輸入值;該程式語言區根據所述變數或函式的格式及該輸入值顯示一相對應的程式語言,且該程式語言區所顯示的程式語言包括所述變數或函式的格式以及該輸入值。
  2. 如請求項1所述的程式語言編輯方法,其中當所述選擇標籤受點擊時,至少一所述輸入欄位即預填一符合該輸入欄位之語義的輸入值。
  3. 如請求項1所述的程式語言編輯方法,其中該變數/函式編輯窗更包括一新增標籤,且當該新增標籤受點擊時,該程式語言區始根據所述變數或函式的格式及該輸入值顯示一相對應的程式語言。
  4. 如請求項1所述的程式語言編輯方法,其中所述程式語言是該程式語言區根據所述變數或函式的格式及該輸入值即時顯示。
  5. 如請求項1所述的程式語言編輯方法,其中該程式語言區為一允許使用者修改所述程式語言的輸入區。
  6. 如請求項1所述的程式語言編輯方法,其中該程式語言區更包括一語法編輯子窗格,且該程式語言編輯方法更包括:該語法編輯子窗格受點擊後,於一所述選擇標籤受點擊時使該語法編輯子窗格顯示一對應所述變數或函式的變數/函式子編輯窗。
  7. 如請求項1所述的程式語言編輯方法,更包括下列步驟:當該語法編輯窗格中未顯示所述變數/函式編輯窗的位置受點擊時,於語法編輯窗格對應所點擊的位置顯示一預設輸入區;當所述選擇標籤受點擊時,在該預設輸入區顯示另一對應所述變數或函式的變數/函式編輯窗。
  8. 如請求項7所述的程式語言編輯方法,其中所述變數/函式編輯窗更包括至少一位移標籤,且該程式語言編輯方法更包括:當所述位移標籤受點擊時,載有該位移標籤的變數/函式編輯窗與至少一其他所述變數/函式編輯窗的相對位置產生改變。
  9. 如請求項1所述的程式語言編輯方法,更包括:所述輸入欄位受點擊時,該編輯介面顯示一選單窗格,該選單窗格載有多個分別對應一預設內容的預設內容標籤;其中一所述預設內容標籤受點擊時,受點擊之該預設內容標籤所對應的預設內容被輸入並顯示於該輸入欄位。
  10. 如請求項1所述的程式語言編輯方法,其中該編輯介面更包括一轉譯按鈕,且該程式語言編輯方法更包括: 當該轉譯按鈕受點擊時,使該編輯介面顯示一完整程式語言窗格,且該語法編輯窗格中所有變數/函式編輯窗中顯示的程式語言被依序顯示於該完整程式語言窗格。
TW106136979A 2017-10-26 2017-10-26 程式語言編輯方法 TWI647618B (zh)

Priority Applications (2)

Application Number Priority Date Filing Date Title
TW106136979A TWI647618B (zh) 2017-10-26 2017-10-26 程式語言編輯方法
CN201711246896.1A CN109710225A (zh) 2017-10-26 2017-12-01 程序语言编辑方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
TW106136979A TWI647618B (zh) 2017-10-26 2017-10-26 程式語言編輯方法

Publications (2)

Publication Number Publication Date
TWI647618B true TWI647618B (zh) 2019-01-11
TW201917572A TW201917572A (zh) 2019-05-01

Family

ID=65804136

Family Applications (1)

Application Number Title Priority Date Filing Date
TW106136979A TWI647618B (zh) 2017-10-26 2017-10-26 程式語言編輯方法

Country Status (2)

Country Link
CN (1) CN109710225A (zh)
TW (1) TWI647618B (zh)

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6269475B1 (en) * 1997-06-02 2001-07-31 Webgain, Inc. Interface for object oriented programming language
US20030105620A1 (en) * 2001-01-29 2003-06-05 Matt Bowen System, method and article of manufacture for interface constructs in a programming language capable of programming hardware architetures
TW200931281A (en) * 2008-01-15 2009-07-16 Mitac Int Corp An editing system and method for application programming interface
TW201510758A (zh) * 2013-09-14 2015-03-16 Chunghwa Telecom Co Ltd 圖控介面設計系統及其圖控介面設計操作方法
TW201713081A (zh) * 2015-09-17 2017-04-01 財團法人資訊工業策進會 具有程式編譯功能之線上討論系統及其方法

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20030131337A1 (en) * 2002-01-07 2003-07-10 Perumainar Asok K. Educational method and tool for isolating and teaching programming language concepts
US8065336B2 (en) * 2004-12-20 2011-11-22 Fujitsu Limited Data semanticizer
CN102279845A (zh) * 2010-06-09 2011-12-14 英业达股份有限公司 以连结形式新增字词辅助说明的系统及其方法

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6269475B1 (en) * 1997-06-02 2001-07-31 Webgain, Inc. Interface for object oriented programming language
US20030105620A1 (en) * 2001-01-29 2003-06-05 Matt Bowen System, method and article of manufacture for interface constructs in a programming language capable of programming hardware architetures
TW200931281A (en) * 2008-01-15 2009-07-16 Mitac Int Corp An editing system and method for application programming interface
TW201510758A (zh) * 2013-09-14 2015-03-16 Chunghwa Telecom Co Ltd 圖控介面設計系統及其圖控介面設計操作方法
TW201713081A (zh) * 2015-09-17 2017-04-01 財團法人資訊工業策進會 具有程式編譯功能之線上討論系統及其方法

Also Published As

Publication number Publication date
CN109710225A (zh) 2019-05-03
TW201917572A (zh) 2019-05-01

Similar Documents

Publication Publication Date Title
US10338893B2 (en) Multi-step auto-completion model for software development environments
CA2937964C (en) Systems and methods for bi-directional visual scripting for programming languages
JP5421239B2 (ja) 複数モードの入力メソッドエディタ
US8667416B2 (en) User interface manipulation for coherent content presentation
US9535667B2 (en) Content collapse outside of selection
US20110080409A1 (en) Formula input method using a computing medium
US20200357301A1 (en) Interactive Learning Tool
US20210405977A1 (en) Method of converting source code in a universal hybrid programming environment
Asenov et al. Envision: A fast and flexible visual code editor with fluid interactions (overview)
WO2022071917A1 (en) Document mark-up and navigation using natural language processing
KR20200034660A (ko) 쉬워진 사용자 반응
Kumar Human computer interaction
US20230195825A1 (en) Browser extension with automation testing support
TWI647618B (zh) 程式語言編輯方法
KR102044614B1 (ko) 입력방법 기반의 웹사이트 정보 제공방법 및 장치
Jakobus et al. Mastering bootstrap 4
Johnson Programming in HTML5 with JavaScript and CSS3
US11698933B1 (en) Using dynamic entity search during entry of natural language commands for visual data analysis
EP4042272A1 (en) User interface generation
US10706215B2 (en) Producing formula representations of mathematical text
Leeds Microsoft Expression Web 4 Step by Step
Hendy Graphically enhanced keyboard accelerators for GUIs
Lee Enhancing the Usability of Computer Applications for People With Visual Impairments via UI Augmentation
McCaffrey Starlogo tng: the convergence of graphical programming and text processing
Johnson Training Guide Programming in HTML5 with JavaScript and CSS3 (MCSD)