Author Archives: admin

/usr/bin/env python3って何?

前提知識

スクリプトの最初の行の#!で始まるものはshebangと呼ばれる。

スクリプトを書いて、実行するときにシステムによってこの行が読まれ、この実行ファイルで当該スクリプトを実行する機能がLinux系のOSにはある。

pythonで実験

以下のファイルを作成 hello.py

実行してみる

python3を明示式に指定して実行すればちゃんと実行できるが、そうでない場合はbashとして実行されている事がわかる。

ここでshebangを加えてみる。

実行

ちゃんと実行できる。

pythonの特殊解釈

しかしpythonのスクリプトではshebangが/usr/bin/python3ではなく、/usr/bin/env python3と記述されている。

/usr/bin/envは引数を起動するだけのプログラムでオプションで環境変数を変更する機能がある。Linuxがこのshebangを読むと/usr/bin/env python3が起動してenvはをPATHなどから探してpython3を実行するものと思われる。

python3ではWindowsとの互換性のために/usr/bin/envがvirtual commandと解され、PATHからpython.exeを見つけるようになるのだと思う。

Windowsの場合は、python.exeの他にpy.exeがシステムディレクトリにインストールされているので、まずpy.exeがスクリプトのshebangを見て適切なpython実行ファイルを探して実行するものと思われる。

githubでソースコードの一部をハイライトするリンクを作成する

ソースを表示する

例:https://github.com/ambiesoft/SceneExplorer/blob/master/src/docinfodialog.cpp

行の左側の・・・をクリックして[Copy permalink]を選択してコピーする

例:https://github.com/ambiesoft/SceneExplorer/blob/dd0d9a261226a23a0d35e9839009e61609216e92/src/docinfodialog.cpp#L36

URLの最後のフラグメントで範囲を指定する

例えば10行目から15行目なら#L10-L15になる。

例:https://github.com/ambiesoft/SceneExplorer/blob/dd0d9a261226a23a0d35e9839009e61609216e92/src/docinfodialog.cpp#L10-L15

Visual Studio Codeで拡張機能がインストールできない

症状

Live Serverをインストールしようとする

しばらくたって失敗する

直し方

設定フォルダC:\User\<ユーザ名>\.vscodeを削除すると直った。
Win+Rでファイル実行ダイアログを表示し%USERPROFILE%\.vscodeと入力するとエクスプローラで開くことができる。

原因考察

原因は不明だがインストーラーから実行した場合にパーミッションがおかしくなっていることが考えられる。

Visual Studio 2022で子プロセスのデバッグ

VS2022になってIDEが64bit化され、大きなプロジェクトでも不正終了しなくなった。そこで子プロセスのデバッグもやりやすくなったと思うのでその紹介。

拡張をインストール

Microsoft Child Process Debugging Powertoolをインストール

有効にする

プロジェクトを開いて子プロセスのデバッグを有効にする。

ブレークポイント設定

プログラムの最初の方にブレークポイントをセットすれば、デバッグ対象プロセスから新規生成されたプロセスでブレークポイントがヒットする。もちろん同じ実行ファイルの場合。

プロジェクトが違う場合

違うプロジェクトの実行ファイルを起動する場合は、起動元のプロジェクトが.NETならまず初めにプロジェクトの設定のデバッグ欄でで、「ネイティブコードデバッグを有効にする」をチェックする。

次に拡張機能の設定で2番目のプロジェクトタイプを設定する。

Visual StudioでThe ‘Global Hub Client Package’ package did not load correctly.

ソリューションを開くと以下のようなメッセージボックスでエラーが出て、ビルドができない。

原因と対策

おかしな環境変数が設定されているとこうなる。msys2などから起動した場合や、msys2経由のファイルマネージャから起動した場合は環境変数を引き継ぐと思うので、引き継がないようにする。

simple menu

簡単なWin32メニューのポップアップ

オーナードローを有効にしてメッセージを処理する

ソースコード

viewport覚書

前提知識

デバイスピクセルとCSSピクセル

デバイスピクセルはscreen.widthなどで取得できるもので物理的ピクセルを表す。CSSピクセルはwindow.innerWidthなどで取得できるもので、ズーム値によって異なる。

screen.widthよりもエレメントのwidthが小さければ画面に収まることになる。しかしユーザがズーム機能を使って200%とかにするとそうはならない。ズーム機能はピクセルを広げる機能と考えられるのでCSSピクセルのサイズはズーム値によって異なる。

デバイスピクセルはズームに関わらず常に一定であり、CSSピクセルはデバイスピクセルにズーム率を掛けたものになる(実際は縦横ともにズームされるので平方で掛ける)。

screen.widthはスクリーン全体の幅でデバイスピクセル値なのでブラウザのズーム値では値は変わらないが、window.innerWidthはブラウザウインドウの幅を表しCSSピクセルなのでズーム値によって値が変わる。(ズーム値を100%以下にしていくとwindow.innerWidthのほうがscreen.widthより大きくなることもある)

viewport

画面の狭いスマホではviewportと呼ばれる仮想のウインドウにページをレンダリングし、その後ページをひと目で見れるように全体を縮小する。ユーザはスワイプやズームを使って見たいところにフォーカスする。

これはモバイルに最適化されていないサイトをできるだけ見やすいようにする仕組み

visual viewportとlayout viewport

モバイル端末では画面が小さすぎるので、viewportを2つの概念に分割する。
visual viewportは画面に表示されているページの一部。ユーザはスクロールやズームで表示内容を変えることができる。layout viewportは全体でvisual viewportlayout viewportの一部を表示していることになる。

モバイル端末ではlayout viewportの値は800pxから1000pxくらいになっている。モバイル端末の幅は400pxくらいなので実際よりも大きい値になる。デスクトップではブラウザウィンドウのサイズになっている。

CSSの%で指定されている値はlayout viewportに対して適用される。
モバイル端末のブラウザでは初期表示時は完全にズームアウトされた状態で表示されることが多く、このときは2つのviewportは一致している。

2つのviewportはCSSピクセルで測られ、visual viewportはズームによってサイズが変わる。

document.documentElement.clientWidthlayout viewportの幅を返す。メタタグのviewportがない限り常にこの値は一定であるが、document.documentElement.clientHeightは端末を回転させて縦横が変わると変わる。

window.innerWidthvisual viewportの幅を返す。

viewportメタタグ

viewportメタタグがない場合はサイズ指定なしのエレメントは親のサイズを継承するのでlayout viewportのサイズになる。layout viewportのデフォルトサイズは800px~1000pxだったのでエレメントもそのサイズになり、通常とても小さく表示される。

<meta name="viewport" content="width=320">
この記述があると、layout viewportの幅が320pxになり、最初の表示のときでもエレメントのサイズは320pxになるので小さく表示されない。

まとめ

デスクトップブラウザではviewportはブラウザウィンドウの幅と同じなので気にすることはなかった。モバイル端末ができて、どうやって今までのサイトを表示しようか考えたときにlayout viewportという概念で800pxくらいの全体のサイズを決め打ちして表示するようにした。しかしそれだと表示がとても小さくなってしまうので、メタタグviewportができてここでlayout viewportのサイズを指定できるようにした。

参照

A tale of two viewports — part two
各種のメタタグでサイズを表示するサイト