반응형 GUI20 Golang GUI(Webview) - HTML 파일 분리 이번에는 Webview 라이브러리를 사용하면서 HTML 파일을 별도로 분리하는 방법을 알아보겠습니다. 그리고, 좀더 보기좋은 GUI 구성을 위해 부트스트랩도 함께 적용하도록 하겠습니다. 사실 이부분은...CSS 파일을 별도로 인식시켰으면 좋겠지만, 아직까지 별도의 CSS파일을 적용시키는 것은 안되는 것 같습니다. 1. 라이브러리 설치 라이브러리 설치는 이전 강좌를 참고하세요. 2. main.go 파일 작성 main.go 파일에 전체 프로그램 구동을 구현합니다. 아울러, 버튼을 클릭했을 때 동작할 함수(go_hello)를 작성하고, 바인딩해줍니다. Webview라이브러리를 활용하면, go에서 javascript를 실행할 수도 있고, html파일(javascript 포함)에서 go언어를 실행할 수도 있습니다.. 2021. 11. 12. Golang GUI(Webview) - 시작하기 Go언어 GUI 라이브러리 중 Webview를 사용해서 데스크탑 앱을 만들어보도록 하겠습니다. Webview는 HTML로 레이아웃을 구성할 수 있어서 간단한 앱은 쉽게 만들 수 있습니다. 1. 라이브러리 설치 이번엔 리눅스환경에서(우분투 20.04) 라이브러리를 설치하겠습니다. sudo apt-get install libgtk-3-dev sudo apt-get install libwebkit2gtk-4.0-dev go get github.com/webview/webview 2. Sample Project 다음으로 간단히 main.go 파일을 생성하고, 아래와 같이 작성해줍니다. package main import "github.com/webview/webview" func main() { w := web.. 2021. 11. 11. C#(WPF) - GUI 연습하기 2 오늘은 아래 유튜브 영상의 데스크탑 어플리케이션을 구현해보겠습니다. https://www.youtube.com/watch?v=qSP8v8Gi3XU 1. 라이브러리 설치 이번 영상에서는 Material Design과 LiveCharts를 사용합니다. 아래의 명령으로 Package를 설치해줍니다. dotnet add package MaterialDesignThemes --version 4.2.1 // material Design 설치 dotnet add package LiveCharts.Wpf --version 0.9.7 // live chart 설치 또는 Nuget GUI Manager 를 설치 후 Shift + Ctrl + P 로 명령창에서 Nuget 입력 시 나타나는 명령을 수행합니다. 그리고 Nuge.. 2021. 10. 30. C#(WPF) - GUI 연습하기(with Material Design) 오늘은 아래 유튜브 영상의 데스크탑 어플리케이션을 구현해보겠습니다. https://www.youtube.com/watch?v=sgEhK3mbDYo 1. 라이브러리 설치 이번 영상에서는 Material Design과 LiveCharts를 사용합니다. 아래의 명령으로 Package를 설치해줍니다. dotnet add package MaterialDesignThemes --version 4.2.1 // material Design 설치 dotnet add package LiveCharts.Wpf --version 0.9.7 // live chart 설치 또는 Nuget GUI Manager 를 설치 후 Shift + Ctrl + P 로 명령창에서 Nuget 입력 시 나타나는 명령을 수행합니다. 그리고 Nuge.. 2021. 10. 29. 파이선 kivy 시작하기4 - 파일 관리(file chooser) 파일관리 프로그램 예제입니다. ## File Chooser from kivy.app import App from kivy.uix.gridlayout import GridLayout class TopGridLayout(GridLayout): def selected(self, directory, filename): try: self.ids.image.source = filename[0] except: pass class TreeApp(App): def build(self): return TopGridLayout() if __name__ == '__main__': TreeApp().run() : cols:2 id:my_widget #FileChooserIconView: FileChooserListView: i.. 2021. 9. 25. 파이썬 kivy 시작하기 3 - 태양계 행성들이 가운데 태양을 중심으로 공전하는 모습을 구현해보겠습니다. import math from kivy.app import App from kivy.uix.widget import Widget from kivy.core.window import Window from kivy.clock import Clock import math Window.size = (900, 900) center_w = Window.size[0]/2 center_h = Window.size[1]/2 class Sun(Widget): pass class Mercury(Widget): pass class Vinus(Widget): pass class Earth(Widget): pass class Mars(Widget): pass cl.. 2021. 9. 25. 파이선 PySimpleGUI 예제 1. hello_world.py import PySimpleGUI as sg sg.Window(title="Hello World", layout=[[]], margins=(100,50)).read() 2. hello_psg.py import PySimpleGUI as sg layout = [ [sg.Text("Hello from PySimpleGUI")], [sg.Button("OK")] ] window = sg.Window("Demo", layout) while True: event, values = window.read() if event =="OK" or event == sg.WIN_CLOSED: break window.close() 3. Image_Viewer.py import PySimpleGU.. 2021. 9. 22. Go언어 - Fyne timer예제 Fyne tutorial에 있는 timer 예제입니다. 1. main.gopackage main import ( "time" "fyne.io/fyne/app" "fyne.io/fyne/widget" ) func showTime(clock *widget.Label) { formatted := time.Now().Format("03:04:05")//현재시각을 포멧에 따라 출력한다. clock.SetText(formatted) } func main() { a := app.New() w := a.NewWindow("Clock") clock := widget.NewLabel("") showTime(clock) w.SetContent(clock) go func() { t := time.NewTicker(time.S.. 2021. 1. 1. Go언어 - Fyne 아이콘 이미지 설정 1. icon.png 이미지 파일을 준비합니다. 2. fyne 패키징 툴을 다운받습니다.go get fyne.io/fyne/cmd/fyne3. icon.png파일을 실행파일의 이미지로 패키징합니다.fyne package -icon icon.png 2021. 1. 1. Go언어 - Fyne 한글 폰트 설정 Fyne를 이용해 GUI를 만들던 중 한글 출력이 안된다는 것을 뒤늦게 알게 되었네요.(아래 화면 참조). 오늘은 한글 설정하는 방법에 대해 알아보겠습니다. 샘플로 간단한 메모장 앱을 만들어보겠습니다. 1. main.go위 샘플로 만든 앱의 코드는 아래와 같습니다.package main import ( "fmt" "image/color" _ "unicode/utf8" "fyne.io/fyne" "fyne.io/fyne/app" "fyne.io/fyne/canvas" "fyne.io/fyne/layout" "fyne.io/fyne/theme" "fyne.io/fyne/widget" ) func main() { f := app.New() //f.Settings().SetTheme(theme.LightThem.. 2021. 1. 1. Go언어 - Lorca GUI 간단한 메모장 이번에는 모듈 구분을 하여 코드를 좀 다듬어보려고 합니다. 아직 Lorca는 예제가 많지도 않고, 튜토리얼이 있는 상태도 아니어서 혼자 여러가지 방식을 시도해 보는 중입니다. 어쨌든 목적은 Control, View와 Function을 다른 파일에 나누어 구성하는 것입니다. 1. lorca_ex.go(Control파일) 앱의 시작부분으로 Control에 해당하는 역할을 합니다. 함수 바인딩을 이곳에서 정의합니다. 그리고 index.html을 불러와서 data에 저장한 뒤 url.PathEscape메서드에 string형태의 인자로 넘겨주는 방식으로 수정해 주었습니다. package main import ( "io/ioutil" "net/url" "github.com/zserge/lorca" ) var ui .. 2020. 12. 9. Go언어 - Lorca GUI 라이브러리 Go 언어로 구현된 라이브러리들도 상당히 많습니다. (https://github.com/avelino/awesome-go#gui). 이전에 Fyne, Gotk3, andlabs/ui, sciter 에 대해서 포스팅한 적이 있는데요...최대한 설치할 것들이 적고 쉽게 구축 가능한 라이브러리들을 찾아보고 있었습니다. 그러던 중 Lorca라는 것을 발견했는데요. 오늘은 이 Lorca 를 한번 사용해보겠습니다. Lorca는 HTML 문법을 사용하여 매우 쉽게 UI를 구성할 수 있다는 장점이 있습니다. 비슷하게는 Webview가 있는데, 가볍고 build된 파일도 용량이 매우 작지만 설치시 조금 애로가 있을 수 있고, 세부설정도 Lorca보다는 조금 어렵다고 합니다. 반대로 얘기하면, Lorca는 설정할 수 있는.. 2020. 12. 8. Go언어 GUI 시스템 트레이에 아날로그 시계 만들기 with go-sciter 지금까지 만든 시계앱을 시스템 트레이로 만들어보도록 하겠습니다. 만들고 나면 이런 모양의 시스템 트레이가 하나 생성되게 됩니다. (Windows 기준). 모든 소스는 아래 공개해 놓았으며, 이전포스트는 굳이 참고하지 않아도 문제없습니다. 이미지는 다른 시계 예제에서 다운받아 온 것인데, 나름 귀엽네요. 그럼 이제 본격적으로 들어가보도록 하겠습니다. 1. 파일 정리 우선 지금까지는 main.go와 main.html에서 각각 기능과 뷰를 담당했는데, 앞으로는 시스템 트레이 프로그램이 메인이 되고, 거기서 clock 프로그램을 불러오는 방식으로 수정하도록 하겠습니다. main.go : 시스템 트레이 실행 (시계 프로그램 불러오기) ㄴ clock.go : 시계 프로그램 실행 (윈도우 생성 / 뷰 불러오기, 기존.. 2020. 9. 25. Go언어 GUI 아날로그 시계 만들기 with go-sciter go-sciter를 이용하여 아날로그 시계를 구현해보도록 하겠습니다. go-sciter를 이용한 프로그램은 데이터처리를 위한 .go 파일과 뷰 제어를 위한 .html파일로 구성이 되어있는데요, 오늘은 아날로그 시계 만들기는 html에서 시계의 움직임까지 표현해주고, .go파일에서는 그냥 html을 로딩하는 역할만 하게됩니다. 우선 결과물은 아래와 같이 나옵니다. 그럼, 소스는... 1. main.go (기본적인 html 로딩 포맷으로 기존과 동일) package main import ( "fmt" sciter "github.com/sciter-sdk/go-sciter" "github.com/sciter-sdk/go-sciter/window" ) // Specifying havily used // Sing.. 2020. 9. 24. Go언어 GUI 투명한 날짜 표시 프로그램 with go-sciter 간단히 날짜 표시하는 앱을 구현해보겠습니다. 1.main.go package main import ( "fmt" "time" sciter "github.com/sciter-sdk/go-sciter" "github.com/sciter-sdk/go-sciter/window" ) // Specifying havily used // Singltons to make them // package wide available var root *sciter.Element var rootSelectorErr error var w *window.Window var windowErr error // Preapare Scitre For Execution /// func init() { // initlzigin window fo.. 2020. 9. 23. Go언어 GUI 투명한 앱 만들기 with go-sciter 윈도우에서 위젯같은 프로그램을 만들려고 프레임/배경/타이틀바 등을 투명하게 할 수 있는 라이브러리를 찾다가 go-sciter라는 것을 찾았습니다. (다른 라이브러리로 투명 구현하려고 한참동안 헤메었네요.ㅜㅜ) sciter는..화면 구성은HTML, CSS를 쓰고 tiscript라는 스크립트로 뷰를 제어하고, 실행 부분에서는 golang, python, rust, c# 등 다양한 언어로 구축할 수 있습니다. 물론 무료이구요. (실행 파일 내부에 sciter.dll을 포함시키기 위해서는 돈을 내야 한다고 합니다. 배포시 sciter.dll을 한 폴더에 같이 배포하면 문제는 없겠네요.) 설치는..1.SDK 설치: sciter.com/download/ 에서 SDK를 다운받아 압축을 해제하고, \sciter\bin.. 2020. 9. 23. andlabs/ui Table예제 코드 Golang으로 테이블을 구현할만한 GUI 라이브러리를 찾고 있는 중, andlabs/ui에서 예제를 발견하여 소스 코드를 올려봅니다. 분석도 좀 필요한데..아직은 그냥 몇몇 부분만 단순화 해놓은 상태입니다. // tabletest.go package main import ( "fmt" "github.com/andlabs/ui" _ "github.com/andlabs/ui/winmanifest" ) type modelHandler struct { row9Text string yellowRow int checkStates [3]int } func (mh *modelHandler) ColumnTypes(m *ui.TableModel) []ui.TableValue { return []ui.TableValue{.. 2020. 3. 30. Glade를 활용한 go언어 gui프로그래밍 이번엔 gtk toolkit 전용 GUI Designer인 Glade를 이용하여 Go언어에서 활용해보도록 하겠습니다. 우선 Glade를 설치해야 합니다. linux에서는 비교적 쉽게 찾아서 설치 가능한데요.. 윈도우에서는 조금 설치가 쉽지 않습니다. Mingw를 설치하고 아래의 명령으로 설치를 진행해줍니다. pacman -S mingw-w64-x86_64-glade 빠른 실행을 위해서는 sourceforge 사이트에서 예전버전을 다운받는 것도 괜찮아보입니다. 다음으로는 Glade에서 UI를 적당히 디자인 해줍니다. (glade예제파일) 생각해보니...그냥 적당히는 안될 것 같네요. 1. 최상위 - > GtkWindow 를 선택해주세요. 그리고 아이디를 main_window, 사이즈를 440, 250 으로.. 2020. 3. 26. Gotk3를 이용한 go언어 GUI 개발 예제 사내에서 사용할 간단한 GUI프로그램 개발 환경을 구상 중입니다. 배포도 해야해서 VM위에서 돌아가는 Java는 좀 꺼림직하고... 다른 언어로 쓸 수 있는 GUI Toolkit을 찾아보다가 결국 QT/GTK/WxWidgets 로 가야할 것 같은데요. 배포가 어렵다는 C/C++로 가는 것 보다는 요즘 언어인 Go언어로, 그리고 바인딩이 잘 되어있는 GTK로 가보려고 합니다. Go언어 바인딩은 Gotk3가 있습니다. 이번 포스트에서는 Gotk3설치 및 예제 프로그래밍까지 수행해 보겠습니다. 우선 사전 준비해야 하는 작업이 좀 있습니다. 생각보다....(이거 하면서 그냥 Swing써야겠다고 생각하는 중....ㅠㅠ) 1. git 설치 2. MinGW-w64설치(MSYS2설치) 3. GTK 및 dependenc.. 2020. 3. 16. andlabs/ui 를 이용한 go언어 GUI개발 예제 Go 언어로 간단한 GUI 구현을 위한 라이브러리로 andlabs/ui라는게 있습니다. 나중에 포스팅할 Glade 같은 GUI designer를 사용하여 구현할 정도가 아니라 간단한 GUI수준을 위해서는 괜찮은 방법인 것 같습니다. 우선 Linux에서 설치는go get github.com/andlabs/ui로 터미널에 입력하여 설치해줍니다.Windows환경에서는 MinGW를 실행해서 설치해야 합니다. 그리고 아래의 예제코드를 입력하고 실행하면...package main import ( "github.com/andlabs/ui" _ "github.com/andlabs/ui/winmanifest" ) func main() { err := ui.Main(func() { input := ui.NewEntry().. 2020. 3. 16. 이전 1 다음
