問題タブ [viewbox]

ViewBoxがXAMLWindows8Metroスタイルアプリでコンテンツをスケーリングするスケール係数を取得する方法はありますか

wpf ウィンドウの縦横比を維持するためにビューボックスを使用したいと考えています。つまり、アプリケーションを大きなモニターに配置すると、自動的にその画面に収まるようになり、ラップトップで実行すると画面に合わせて調整されます。これについて私を助けてください。ビューボックスを使用して、xaml wpfで純粋に実行する必要があります。

これが実際のjsFiddleの例です。

基本的には、数字を入力して「追加」をクリックします。その数のボックスを含む行はRaphaelを使用して生成され、ビューボックスは行に合わせてサイズが変更されます。行を追加すると、ビューボックスのサイズが再び変更されます。これは正常に機能します。

私の問題は、ボックスを作成した後、行の最後に削除オブジェクトを追加することです。これをクリックすると、行が削除されます。これは正常に機能しているように見えますが、新しい行を追加しようとして行を削除すると、コンソールメッセージでビューボックスが縮小するという点が異なります。

エラーは次の2行のコードから発生していることがわかります。

sectionSize.widthとはNaNですが.height、理由はわかりません。行を正しく削除していませんか？

完全なコード：

HTML

私は巨大なsvg 3200 * 1800を持っています。幅が支配的な属性であり、高さのスクロールバーがあることを確認して、その画像の一部のみを表示したいのですが、ビューボックスを設定すると、幅が増えて追加された高さが表示されます。

これを止める方法はありますか？

私はsvgサークルを作成するためにラファエルを使用しています。http://jsfiddle.net/9zu4U/10/で提案されているように、setViewBoxを使用してズームとパンも行っています。実際、私の問題は、画面上に円を作成し、その円をクリックすると、大きな円の中に20個の小さな円が作成されるようなものです。ズームインして、小さい円のいずれかをクリックします。その円の中に20個の円を作成します。そして、ズームインなどします。しかし、6〜7レベルを超えると、歪んだ円と六角形ができます。これの理由は何でしょうか？それはMozillaでは起こりません。

最初は非常に大きな紙と非常に大きな円を作成し、画面に合うようにズームアウトして表示してみました。最小の円の半径が10進値にならないようにするためです。

編集：例jsfiddle.net/LbcPd/3。

これはこれに尋ねられる多くの同様の質問ですが、良い答えはありませんか？コンテキスト描画を使用して、特定の長方形のサイズ「720,576」で入力テキストを描画します。行数を維持しながら、テキスト全体を最大フォントサイズに合わせる必要がありますか？

私はそれを計算するための方程式を作成しようとしましたが、役に立たなかった。テキストがクリップされるまでサイズをループしようとしましたが、その状態をテストできませんでした。1週間検索して、似たようなものを見つけましたが、役に立ちませんでした。

最後に、私が望むものに近いビューボックスを使用しようとしましたが、幅のサイズが常に1行にすべてのテキストを含むため、内部のテキストブロックが複数行になることはありません。

これが私が得たものです：

助けていただければ幸いです、ありがとう。

AEROガラスが提供するのと同様の効果、ぼやけたウィンドウを構築しています。これはWPFでは簡単ではないことにすぐに気付きましたが、ほぼ完全に機能させることができました。ビューボックスが関係しているときに私は立ち往生しています。

つまり、長方形を作成し、視覚的なブラシを作成して特定の背景要素の一部を取得し、ビューボックスを変換して、長方形が重なる画像のスペースを正確に取得し、それを長方形の塗りつぶしとして使用しました。

ElementNameグリッドは、長方形と画像の共通の親を参照します。それらを祖先にすることはできません。そうしないと、ブラー効果が妨げられます。だから私はそれらをグリッドに並べて配置します。

最後の部分は、VisualBrushビューボックスの実際の計算を行うMultivalueコンバーターです。

したがって、これはすべて、次の問題を再現するために必要です。コードをテストする場合は、単純なwpfアプリケーションに簡単に配置できます。

これをテストすると、正常に機能していることがわかります。ビューボックス内に長方形を配置し、固定サイズのグリッドを配置すると、問題が発生します（これは私の実際の問題を模倣しています）。

したがって、ビューボックスからのスケーリングはレイアウト後に適用されると推測しているため、TransformTo呼び出しでは認識されません。しかし、私はすでに変換でビューボックスの実際のスケーリングを使用しようとしましたが、運がありませんでした。ビューボックスがそこにある限り、私はそれを機能させることができないので、誰かが何が間違っている可能性があるのか​​を知っているか、もっと簡単な解決策を教えてくれることを願っています。そのコードを後でカスタムコントロールに変換して、それを簡単に再利用できるようにしたいので、特別な条件にあまり依存しない方法を好みます。

サイズ変更可能なdivがあります。2つの内部divがあります。内部divの1つにsvg要素が含まれています。

svg要素では、コンテンツを動的に追加および削除して、毎回svgに何かを追加するようにしています。20pxを追加して高さを増やし、削除すると高さを20px減算します。svgの高さが親のdivより大きくなると、親のdivにスクロールバーが表示されます。同様に、svgの高さが親のdivより小さい場合、スクロールバーは削除されます。

サイズ変更を行うと問題が発生します。サイズを変更するために、svgにビューボックスオプションを追加しました。しかし、サイズを大きくすると、svg要素の一部が表示されなくなります。サイズを小さくすると、svgが低い位置に配置され、空きスペースが残ります。

ビューボックスプロパティでsvgの位置/高さを処理する方法が頭に浮かびました。

どういうわけか、動作をシミュレートするためにフィドルを作成しようとしました。ただし、ここではsvgの要素は動的に追加されておらず、svgの高さは一定です。

私のコードへのリンク

どんな助けでもありがたいです

私は現在、JavaScript と SVG を学習して作業していますが、これは初めてです。これが私のシナリオです

内部に SVG がある div があります。

div に対するマウスの位置を知りたいので、次のコードを書きました。

正常に動作しています。しかし、クエリ resizable を使用して div にサイズ変更機能を追加すると、問題が発生します。svg のサイズを変更するには、viewBox オプションを追加しました。

しかし、マウスの座標がうまく機能せず、ラインがマウスから少し離れてしまい、div サイズを大きくすると、マウスからさらに離れてしまいます。svgにビューボックスオプションがある場合、オフセット位置を計算する方法を教えてください。

ヘルプとガイダンスに感謝します。

ViewBox内にビデオコントロールを配置することにより、ビデオ比率を維持するWPFプロジェクトがあります。ビデオコントロールは、WindowsFormsHost内にラップされたWinFormsオブジェクトです。また、ViewBoxのサイズを変更するためにgridSplitterを追加しました。奇妙なバグに気付くまで、すべてうまくいきました。gridSplitterコントロールを使用してViewBoxをゼロに近づけると、ビデオの比率が再び拡大された後に失敗します。また、gridSplitterを使用してViewBoxを0まで縮小すると、WindowsFormHostは展開後に完全に消えます（まだ存在しますが、ActualWidthとActualHeightは0になります）。

ViewBoxコントロールを削除し、WindowsFormsHostを使用するだけで問題なく動作しますが、アスペクト比を制御するにはViewBoxが必要です。解決策が見つからない場合は、回避策として自分で比率を制御する必要があります。

私は何か間違ったことをしているに違いないと思ったので、問題を再現する簡単なテストプログラムを作成しました。以下に完全なプログラムへのリンクを投稿します（C＃、VS2008にあります）。

テストプログラムでは、サイズを変更できるグリッドスプリッターを備えた2列のグリッドを作成します。次に、左側のコントロールにViewBoxを配置し、その中にWindowsFormsHostを配置します。次に、WindowsFormsHost内で赤い_winFormsButtonをホストします。

左の列を完全に縮小してから再度展開するまで、ボタンは細かく拡大縮小されます。ボタンがなくなりました。これを防ぐにはどうすればよいですか。左の列を縮小および拡大した後もボタンは拡大縮小され続けますか？ありがとう。

XAML：

コードビハインド：

サンプルコード出力：

テストプロジェクトコード（VS2008）へのリンク： コード