search
LoginSignup
3

More than 1 year has passed since last update.

posted at

updated at

お手軽Linux(Ubuntu) GUIアプリ開発 パーツサンプル集

各コントロールごとのサンプル

スクリーンショット 2020-04-20 14.39.21.png

Git Sourth

コントロールの位置を指定する

Fixed fixed1 = new Fixed();
fixed1.Put(コントロールUI, x, y);
fixed1.Move(コントロールUI, x, y);
this.fixed1.Move(コントロールUI, x, y);
ラベルにテキストを入力する
label1.Text = "testtest";
チェックボタンをにイベントを追加する

GUIデザイナーからもクリックでイベント文を自動生成できます。

//チェックボックスをOnにする
checkbutton1.Active = true;
checkbutton1.Clicked += clickedCallback;

void clickedCallback(object obj, EventArgs args) {
    if(((ToggleButton)obj).Active) {

    }       
}
checkbutton2.Active = false;
checkbutton2.Clicked += delegate (object obj, EventArgs args) {
    if(((ToggleButton)obj).Active) {

    }
};
ラジオボタンをにイベントを追加する
//ラジオボックスをOnにする
radiobutton1.Active = true;
radiobutton1.Clicked += radioBtnClickedCallback;
void radioBtnClickedCallback(object obj, EventArgs args) {
    if(((RadioButton)obj).Active) {

    }
}

radiobutton2.Active = false;
radiobutton2.Clicked += delegate (object obj, EventArgs args) {
    if(((RadioButton)obj).Active) {

    }
};
イメージを表示する

他にもバイナリーデータを直接入れて表示することもできます

image1.Pixbuf = new Pixbuf("画像ファイル名");
textViewを表示する
textview1.Buffer.Text = "testtest";
spinボタンに数字を設定する
spinbutton1.Value = 1;
TreeViewを表示する Extensionを使用(gitにあがっています)
Gtk.TreeViewColumnEx artistColumn = new Gtk.TreeViewColumnEx();
artistColumn._mkCellRendererText();
artistColumn.Sizing = TreeViewColumnSizing.Fixed;
artistColumn.FixedWidth = 200;
artistColumn.Title = "Artist";
artistColumn.bindingPropertyName = "Artist";

Gtk.TreeViewColumnEx songColumn = new Gtk.TreeViewColumnEx();
songColumn._mkCellRendererText();
songColumn.Sizing = TreeViewColumnSizing.Fixed;
songColumn.FixedWidth = 200;
songColumn.Title = "Song Title";
songColumn.bindingPropertyName = "Title";

Gtk.TreeViewColumnEx deleteCheckColumn = new Gtk.TreeViewColumnEx();
CellRendererToggle toggleCell = deleteCheckColumn._mkCellRendererToggle();
deleteCheckColumn.Sizing = TreeViewColumnSizing.Fixed;
deleteCheckColumn.FixedWidth = 50;
deleteCheckColumn.Title = "削除";
deleteCheckColumn.bindingPropertyName = "Effective";

toggleCell.Toggled += delegate (object o, ToggledArgs args) {
    TreeIter iter;
    if(musicListStore.GetIterFromString(out iter, args.Path)) {
        Song Song1 = (Song)musicListStore.GetValue(iter, 0);        
    }
};

treeview2.AppendColumn(artistColumn);
treeview2.AppendColumn(songColumn);
treeview2.AppendColumn(deleteCheckColumn);

artistColumn._mkBinding();
songColumn._mkBinding();
deleteCheckColumn._mkBinding();

treeview2.Model = musicListStore;

this.ShowAll();
Comoboxを表示する Extensionを使用(gitにあがっています)
combobox20._mkCellRendererText("Artist");

combobox20._mkBinding();

combobox20.Model = musicListStore;

MenuBar ToolBar StatusBarを表示する

Git Sourth
スクリーンショット 2020-04-20 18.52.56.png
VBoxを追加します。Boxを縦に4つにします
スクリーンショット 2020-04-20 18.36.38.png
一番上のBoxにMenuBarを追加します。メニュー項目を追加していきます。プロパティのシグナルからToggledをクリックすることでイベント文が自動生成されます
スクリーンショット 2020-04-20 18.39.54.png
2番目のBoxにToolBarを追加します。アイコンを追加していきます
スクリーンショット 2020-04-20 18.40.11.png
3番にFilxedを追加します。高さを追加します
スクリーンショット 2020-04-20 18.40.31.png
4番目にStatusBarを追加します。

UIコントロールのラップしたウェッジを作る

Git Sourth

できること
UIControlを継承したUIControlExクラスを作成できる。OverRideもできるようです
ツールボックスにコントロールアイコンが登録されドラッグして使えます。

新しいプロジェクトを作ります。新しいウェッジを選択
スクリーンショット 2020-04-19 10.41.46.png

Widget.csファイルを開きます。デザイナータブを押します。
スクリーンショット 2020-04-19 10.42.39.png
ツールボックスからコントロールを選びデザイナーにドラッグします。ここではComboxを選択します
スクリーンショット 2020-04-19 10.43.05.png
Conboがドラッグされた状態
スクリーンショット 2020-04-19 16.20.51.png

全てビルドします
スクリーンショット 2020-04-19 16.20.59.png

ツールボックスにカスタムウェッジが表示されます
スクリーンショット 2020-04-19 16.21.27.png

MainWindowのデザイナーに配置します。Widthの値を設定します。
スクリーンショット 2020-04-19 16.22.19.png

ウェッジコンポーネントのprivateにCombBoxが生成されているので、Getterなどで取り出して使います。
ウェッジコンポーネントの中にプロパティを書くことで、UIControllを継承したクラスにプロパティを追加したような感じができます。

using Gtk;
namespace wegeTest1 {
    [System.ComponentModel.ToolboxItem(true)]
    public partial class ComboWidget : Gtk.Bin {
        public ComboWidget() {
            this.Build();
        }
        public string bindingProperyName = "";
        public ComboBox _mkComoboBox() {
            return combobox15;
        }
        public ComboBox Combo {
            get {
                return combobox15;
            }
        }
    }
}

OverRideのやりかた
https://stackoverflow.com/questions/20469706/loading-pixbuf-to-image-widget-in-gtk

熟練すればこのようなものが作れるようになります。
スクリーンショット 2020-04-20 18.58.43.png
GtkSharp

お手軽Linux Guiアプリ開発 入門
お手軽Linux GUIアプリ開発 初級 前編
お手軽Linux GUIアプリ開発 初級 後編

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
3