VisualStudioCode（Ubuntu用)の調整

今度はUbuntu上でVSCを操作できるようにしてみましょう。

VSCを起動するためにここではUbuntuのプロンプトを使います。

ウインドウが現れたら、

code .

と入力しEnterを押します。

すると、時間は若干かかりますがVSCをUbuntu経由で起動しようとしています。

このような画面が表示されますが、ちょっと何言っているかがわからないので"キャンセル"を押しておきます。

そうすると、画面にはWindowsの調整でも現れた、WSCのインストールの確認が表示されます。

WSLをインストールし、VSCを終了し、改めて code . で起動するとUbuntu上でInstalling VS Code Server for Linuxがインストールされるので、そのまま起動まで待ちます。

なお、Ubuntuのウインドウは閉じずにそのままにしてください。

起動した画面でWSL（Ubuntu）の環境で使用る拡張機能をインストールします。

次が最後になります。

最後にbuilozerで使用するフォルダー（今回はsampleとします）を追加します。

これで環境は揃いました。

では、ここで作成したsmpleの位置はどこになるのか見てみます。

エクスプローラーのアドレス欄に

\\wsl$

と入力すると

Ubuntuというフォルダーが出てきます。

これが、構築した仮想環境のUbuntuの位置となります。

ここから"Ubuntu/home/(設定したID)/"

と選んでいくと、以下のようにsampleというフォルダーが現れ、ここがVSCで先ほど作成したsampleフォルダーとなります。

さてここで、"PATH"を通します。

これは一種のおまじないのようなもので、環境変数と言われるものの定義を意味します。

今回定義を加えるファイルは".bashrc"というファイルです。

"Ubuntu/home/(設定したID)/"にあると思います。

通常なら、テキストエディターで編集しますが、せっかくVCSを開いているので、ここで編集してみましょう。

ファイルを開くと

このようにファイルの中身が表示されます。

こにPATHを通します。

ファイルの最後の行に以下の内容を追加します。

export PATH=$PATH:~/.local/bin/

どうでもいい話ですが、このファイルはShellScript（右下の丸の部分）で書かれているようです。すごいですね、ソースの内容を見て使われている言語を判断するのは。

次はこのファイルを保存します。

左上の"ファイル">"保存"を押して保存完了になります。

そのまま閉じて構いません。

ではソースファイルを作成しますが、すでにこちらで使用したものを再利用します。

『VisualStudioCode（Windows用)の調整』

ファイルを保存する場所を指定します。

画面で"sample"フォルダーがあります。

今このフォルダーは作成したばかりで、中にはないもないはずです。

ここをクリックすると、右向きに表示されていた">"が下向きになるはずです。

ここにファイルを作ります。

"Ubuntu/home/(設定したID)/sample/"

に"main.py"というファイルを作ります。

ファイル名は必ずこれにしてください。

そうしないとファイルの作成がうまくいきません。

"ファイル"より"新しいテキストファイル"を選びます。

そうすると、エディターの画面になります。

ちなみに、ここでは"プレーンテキスト"という扱いになっています。

さて、ソースを入力（コピペ）できるようになりました。

# -*- coding: utf-8 -*-

import kivy

from kivy.app import App

from kivy.uix.label import Label

class MyApp(App):

    def build(self):

        return Label(text='Hello world')

if __name__ == '__main__':

    MyApp().run()

これをコピペしましょう。

コピペ完了です。そうすると、右下はこのソースの言語は"python3.10.12"ですと表記されています。

ここで、WindowsとUbuntuでは開発環境の差分がでることがわかります。

もともと、そういう目的でpythonをインストールしたのでこのままでいいです。

さて、保存しましょう。

"ファイル">"名前を付けて保存"を選びます。

上に（1行目のソース）.pyとファイル名が表示されているので、これをmain.pyに変更します。

更に下に"sample"とあるので、ここをクリックすると、保存するフォルダーに"sample"が追加されるはずです。

保存が完了すると、左の"smple"フォルダー下に"main.py"が追加されたことがわかります。

ここで、一旦実行してみましょう。

F5キーを押すと、ウィンドウが出てくるはずです。

これでUbuntuので下準備は完了しました。

最後にbuildozerを使ってapkファイルの作成を行いましょう。

Ubuntuのウインドウでもできますが、ここでは敢えてVSCの中の"ターミナル"で行います。

シームレスな環境での開発が目標ですので。

ターミナルの画面より

cd sample

と入力すると、現在のパスの位置が変わります。

ここで、apk作成を行います。

buildozer init

入力すると。

"File buildozer.spec created, ready to customize!"

と表示され、sampleフォルダーに"buildozer.spec"というファイルが追加されたのがわかります。もしエラーが出るようでしたらUbuntuやVSCの再起動をしてみて下さい。

最後です。

buildozer -v android debug

これを入力してください。

尚、初めてのapkファイルのビルドには時間がかかります。

あと、ネット環境必須です。

約1時間半程待ちました。

以下のようになるとapkファイル完成です。

apkファイルは"bin"フォルダーの下に作成されます。

それをAndroid端末に転送すれば、インストールが行われてアプリが起動します。

これで、Ubuntu環境での調整は完了です。

VisualStudioCode（Windows用)の調整

インストールが完了すると以下のような画面になります。

丸で囲んだところは、後々必要になりますが、今は無視するのでXで消しておきます。

丸囲みしたアイコンの方をクリックします。

そうすると、検索の画面が現れるので、そこで"Japanese"と入力します。そうすると

上のように"Japanese Language…"と地球儀のアイコンのものが出てくるので、これをインストールします。

インストールが完了するとVSCが再起動されます。

再起動後、またWSLが…という画面が出てきますが、ここでもXをクリックして消します。

次に以下の拡張機能を追加します。

"kivy"と"Python"と"Python Debugger"をインストールします。

インストール時に必要なさそうな拡張機能も一緒にインストールされますが、それはアンインストールでいいでしょう。

これで環境は完成です。

早速、コードを記述（というかコピペ）してみましょう。

以下のコードをコピーします。

# -*- coding: utf-8 -*-

import kivy

from kivy.app import App

from kivy.uix.label import Label

class MyApp(App):

    def build(self):

        return Label(text='Hello world')

if __name__ == '__main__':

    MyApp().run()

これは、ウインドウを出してその中心に"Hello world"と表示させるプログラムです。

入力が終わったら以下のように … > 実行 > デバッグの開始

または、F5キーを押します。

そうすると、初めての実行の場合、以下のようにデバッガーの選択が現れるので、pythonファイルを選択します。

これ以降はVSCではpythonをコーディングすると認識するので、デバッガーの選択は現れません。

しかし、インストール直後や、その日の最初の起動では以下のような画面が現れることがあります。

これは時に気にせず、キャンセルを押して再度実行してみましょう。

上のような画面が現れれば成功です。

これでWindows環境の構築は終了です。

ファイル名は必ず"main.py"として保存してください。

最後にこれをexe化します。

これについては、前の記事にもありますが以下のページを参考にしてください。

PythonのスクリプトをPyinstallerでexe化する方法 - TECH PLAY Magazine

ちなみにここでは 、普通にコマンドプロンプトを使わず、あえて画面下の”ターミナルを使って"でexe化してみましょう

また、Windows上のpythonのバージョンの確認もしてみましょう。

ターミナル上でも

pyinstaller main.py 

と入力（コピペ）してEnterを押すとコマンドプロンプトと同じ動きをします。

更に、右下の丸囲みでは現在のpythonのバージョン、つまり、初めにWindowsにインストールしたpythonのバージョンと同じであることがわかります。

これを私はやりたかったのです。

Windows下でほぼ最新のpythonを使って、kivyを使った開発。

それが目の前で展開できているので、うれしい限りです。

さて、最後にUbuntuベースでのVSCの設定を行います。

VisualStudioCode(VSC)のインストール

では、VisualStudioCode(VSC)のインストールを行います。

以下のページよりVSCのインストールファイルをダウンロードし、ダウンロードしたファイルを実行します。

Visual Studio Code - Code Editing. Redefined

インストール中以下の画面が出ますが、画面通りにチェックをつけておけば特に問題はないでしょう。

これでインストールは完了です。

次からは各環境の調整を行います。