電子工作作業報告書その53
今現在のフォーム1,2,3の画面はこのようになっている
なのでCSSを使って画面のデザインを修正した
現時点ではフォーム1を修正した
/* data_form用のcss flexアイテムは縮小しないので追加する firefoxで要素がつぶれる場合はflex-shrinkを追加する事で解決出来る */ text { margin: center; flex-shrink: 0; } textarea { width: 300px; text-align: center; flex-shrink: 0; } button { margin: 35px; flex-shrink: 0; } /* カーソルを乗せた時の見た目*/ button:hover { background-color: #7706da; }
出来栄えはこんな感じ
フォーム2と3は後日直す
次回はフォーム2と3のCSSを作成しデザインを整える
svgからpng変換その7
ポップアップで通知するメッセージリストを作成する
#svgからpng変換用ポップアップで通知test.py #4種類用意する ポップアップで通知する際にはタイトルを付ける フォントサイズを17くらいにする #フォントは「小塚ゴシック」にするのを共通とする #1.変換中 背景色は青で、「'選択されたファイル名'を変換処理中です」とメッセージ #2.変換終了 背景色は緑 #3.変換エラー 背景色は薄い赤色 #4.ファイルが選択されていない警告メッセージ 背景色は黄色 import PySimpleGUI as sg sg.popup_error('何らかが原因でエラーが発生しました', background_color='pink', text_color='black', font='小塚ゴシック 17', title='変換エラー') sg.popup_ok('変換が終了しました \n確認して下さい', background_color='green', text_color='black', font='小塚ゴシック 17', title='変換終了') sg.popup_ok('ファイルが選択されていません', background_color='black', font='小塚ゴシック 17', title='警告') sg.popup_ok('ファイルを変換中です。\nしばらくお待ち下さい', background_color='blue', font='小塚ゴシック 17', title='変換中')
ついでにプログレスバー無し、サムネ生成機能を廃止した
ver6.0のイメージ図が出来上がったので掲載する
イメージ図に沿ってレイアウトを形成していく
次回は、ver6.0をイメージ図通りに作っていく
svgからpng変換その6
今回は、実際に特定の拡張子のみを選択する仕方を作成する
#画面レイアウトに従いレイアウトを作り込む #2022-7-20作成 #4.0では、svgだけの名前を取得し、選択できる様にする #デスクトップにある「circuit_svg」というフォルダにkicadで作成した回路図やパターン図のsvgを保存している #ファイル選択時にsvgのみ表示させる import PySimpleGUI as sg sg.theme('LightGreen3') layout = [ [sg.T()], [sg.Text('circuit_svgフォルダから変換したいSVGファイルを選択して下さい', font=20)], [sg.T()], [sg.Text('ファイル名', font=17), sg.InputText(key="-INPUT1-", font=18)], [sg.T('')], [sg.T(' '*30), sg.FileBrowse(button_text="ファイルを選択", key="-FILE-", target="-INPUT1-", font=26, file_types=(("Svg ファイル", "*.svg"),))], [sg.T('')], [sg.Button('停止', key="-STOP-", button_color='black', font=16), sg.T(' '*10), sg.Button('変換を実行', key="-START-", font=16)], [sg.Text('実行後にファイルがpngに変換されます', font=20)], [sg.T('')], [sg.FileBrowse('別名で保存', enable_events="-BET-", button_color='red', file_types=("","*.png"), size=(14,1), font=24)], [sg.T('')] ] window =sg.Window('svgをpngに変換ver4.0(ファイル選択時にsvgだけを取得する)', layout) while True: event, values = window.read() # print(event) if not event: break window.close()
フォルダには、SVGファイルとDXFファイルが
保存されていたが、選択ボタンをクリックすると
SVGファイルのみ表示されていた
次回はポップアップで通知するメッセージリストを作成する
svgからpng変換その5
原因を探るともにサムネイルを作成する機能を廃止する
サムネを作成する機能を付ける予定だったが
調べてみると難易度が高めだったため廃止する
このsvgからpngに変換するツールで
重要なのは
1.ファイルを選択出来る事
2.svgからpngに変換出来る
3.別名で保存出来る
という3つなので、
サムネイルを作成するというのは、オプションに過ぎない
では、原因を探っていく
分からない・・・
なので、特定の拡張子のみを選択する仕方を勉強する
それからプログレスバー(進捗状況をリアルタイムで見れる)を
GUI上に表示するのは現時点では難しいので
これをポップアップで通知する形をとる
次回は、実際に特定の拡張子のみを選択する仕方を作成する
減量管理入力補助GUIその16
カラムを使ったGUIを試しに書いてみた
import PySimpleGUI as sg # Column layout # カラム1 col1 = [ #運動回数入力欄 ] #カラム2 col_2 = [ #グラフ領域 [sg.Canvas(size=640,480), key='-CANVAS_1-')], ] layout = [ #上部カラム [ sg.Coulm(col1,vertical_alignment='True'), sg.Column(col_2, vertical_alignment='True', justification='True') ], #下部カラム [ sg.T(size=45,5), key='-M-BOX1-', backgroud_color='black'), sg.Multiline(size=45,5), key='-M-BOX2-'), sg.Button('ファイルを開く'), sg.T(' '*20), sg.Button('グラフを表示'), sg.T(' '*20), sg.Button('PDF生成') ] ]
これらをlayoutに格納して、要素を任意の位置で表示させる
次回は、このレイアウト通りにGUIを作ってみる
工具管理GUIその12
try-exept構文が完成した
また作っていくうちにテーブルが増えたので併せて掲載する
完成したものはこれ
try: #tool_itemテーブルの定義 ddl = """ CREATE TABLE tool_item ( model_number INTEGER PRIMARY KEY, number_of_prossessions INTEGER NOT NULL, manufacture_name TEXT NOT NULL UNIQUE, remarks TEXT NOT NULL UNIQUE ); """ # SQLの発行 c.execute(ddl) #tool_dataテーブルの定義 ddl = """ CREATE TABLE tool_data ( id INTEGER PRIMARY KEY AUTOINCREMENT, class_tool TEXT NOT NULL UNIQUE, item_code INTEGER NOT NULL, model_number INTEGER, number_of_possessions INTEGER NOT NULL FOREIGN KEY(model_number) REFERENCES tool_item(model_number) ); """ # itemテーブルへリファレンスデータの登録 c.execute(ddl) c.execute("INSERT INTO tool_item(manufacture_name,remarks) VALUES('日本アルミット', '非塩素ヤニ入り半田');") c.execute("INSERT INTO tool_item(manufacture_name,remarks) VALUES('Pro'skit', 'ワイヤーストリッパー');") c.execute("INSERT INTO tool_item(manufacture_name,remarks) VALUES('ホーザン', '竹製のピンセット');") c.execute("INSERT INTO tool_item(manufacture_name,remarks) VALUES('サンハヤト', 'DIP型ICの足をそろえる道具');") c.execute("COMMIT;") except: pass
という風に書ける
回路草案入力フォームその25
Flask(フラスク)はAnacondaをインストールした時に自動的に
インストールされていたので、今回はpip installの操作はいらなかった
記述出来たら、コマンドプロンプトかターミナルを開いて
app.pyを保存した場所にカレントディレクトリを移動する
移動出来たら以下を実行する
実行する事で、Flaskのwebサーバーが立ち上がり、ブラウザからアクセス出来る
要になる
set FLASK_APP=board_draftinput_app.py flask run
ウェブブラウザを立ち上げ、以下のアドレスを記述する
http://localhost:5000/
画面上に表示されれば成功
アプリを終了する場合は、コマンドプロンプトまたはターミナルで
CTRL+Cを押す
次回は、毎回アプリを実行する度にコマンドプロンプト画面に
切り替えるのも煩わしいので、pyファイルを直接実行する形で
サーバー立ち上げたい