開発Blog

1pxへのこだわり♪

投稿日:

IM-FormaDesignerでは、Webブラウザ上でアプリを作ることができます。
まもなくリリース予定のパッチ2では、フォーム・デザイナに関して以下の3つの改善と修正を行います。

  • 要件 [16792] 選択した画面アイテムをカーソルキー(←↑→↓)で移動できるように改善
  • 要件 [17012] フォーム・デザイナで画面アイテム選択時および枠線表示時に1pxずれる
  • 要件 [17013] アプリ実行時に画面アイテムの右端・下端が少し切れてしまう

各要件の詳細は以下の通りです。フォーム・デザイナに関しては、Undo/Redoや複数選択して移動したい等、多数のご要望をいただいております。順次改善してまいりますのでご期待ください。

選択した画面アイテムをカーソルキー(←↑→↓)で移動できるように改善

フォーム・デザイナでは、これまで画面アイテムの移動はマウスまたは画面アイテムのプロパティで行ってました。でも画面アイテムの配置の微調整がやりづらかったです。。

そこでパッチ2では、選択した画面アイテムをカーソルキー(←↑→↓)で移動できるように改善いたします。

カーソルキーだけの場合、10pxずつ移動し、Ctrlキーを押しながらカーソルキーを押すと1pxずつ移動させることができます。

これで微調整がやりやすくなり、1pxにこだわったデザインができるかと思います♪

フォーム・デザイナで画面アイテム選択時および枠線表示時に1pxずれる

配置した画面アイテムをクリックすると、見た目上、右方向と下方向に 1px ずれていました。。

原因は、画面アイテムが選択されたときに1pxの枠線を表示しているのですが、この1px分の枠線の表示方法に問題がありました。

画面アイテムの位置を変えずに、枠線を表示するためには、画面アイテムを1px分左方向と上方向にずらしてあげる必要があり、対応しております。。

この修正により、1pxのずれもなく、各画面アイテムを配置できるようになります。

アプリ実行時に画面アイテムの右端・下端が少し切れてしまう

「フォーム・デザイナ上ではちゃんと表示されているのに、実行すると、右端または下端が少し切れてしまう」という現象が度々報告されていました。。。

こんなとき私は、「大きめに横幅と縦幅のサイズをとってください」とお願いしておりました。。。

実はブラウザの問題と思っていたのですが、、調査していく中で、製品の問題であることに気づきました。。。

申し訳ございませんでした。

アプリ実行時の画面ではフォーム・デザイナより、右端および下端が16px分小さくなっておりました。。。

しかし、この問題が解消できても、1点注意していただきたいことがあります。

それはアプリを利用するブラウザによっては、切れてしまう場合があります。
たとえば、IE9でアプリを作り、そのアプリを違うブラウザ(IE8やFirefox等)で見ると、切れてしまう場合があります。この現象は画面アイテム「ラベル」で発生しやすいです。

主な理由は、ブラウザの既定フォントの設定内容です。
フォントが変わることで、「ラベル」に設定した内容が大きく表示される場合があり、下部が切れて表示されることがあります。

この問題については製品としての制御が難しいため、良い解決方法が見つかるまでは「大きめに横幅と縦幅のサイズをとって回避してください」とお願いさせてください。

-開発Blog
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

社員が運営するタイ料理ランチケータリングサービス

こんにちは。エンタープライズソリューション本部の久木田(通称くっきー)と申します。 この会社のタイ料理店の店長をしています。 最近、矢野さんのトイレの空き状況の見える化システムや高松さんの社員が運営す …

no image

ApplicationRuntimeのライセンス数制限の仕様について

  ※下記内容は、過去のintra-mart(Ver4.3以前)に関する内容です。最新のintra-martでは、異なる情報であることがありますので、ご注意ください。   intr …

no image

FormaDesigner「正方形/長方形」を使って帳票っぽい画面を作る♪

FormaDesignerのパッチ1が1/27にリリースされました。 そのパッチ1で追加された画面アイテム「正方形/長方形」を使って、帳票っぽい画面を作ってみました。     上記 …

no image

intra-mart WebPlatform/AppFramework Ver7.2について その5

今回で、iWP Ver7.2の紹介は、最終回です。 ■開発系 ドラッグ&ドロップによるファイルアップロード用タグ intra-mart WebPlatform/AppFramework Ver …

no image

Formaの画面遷移を制御するには

今回のブログ記事では、スクリプトを利用してFormaの画面遷移を制御する方法を紹介します。 目次 条件に応じて遷移先を変更する フォーム遷移設定 サンプルコード サンプルアプリケーション 処理後の遷移 …

まだデータがありません。

RSSRSSRSSRSS