6

次のような漠然としたウィジェットを定義したいと思います。

{% block css %}
.mywidget {
     css: goes_here;
{% endblock %}

{% block widget %}
<div class="mywidget">
   <!-- structure goes here -->
</div>
{% endblock %}

{% block script %}
$( ".mywidget" ).addFunctionality(stuff)
{% endblock %}

言い換えれば、ウィジェットが必要とする CSS、その内容 (できれば何らかの方法でパラメータ化されている)、およびファイルの最後に必要なスクリプトの減速です。次に、レイアウト テンプレートを拡張し、ウィジェットを本体に追加し (おそらく、同じ種類の複数のウィジェットで、何らかの異なるパラメーターを使用)、CSS と JavaScript をページの上部と下部に適切に追加できるようにしたいと考えています。レイアウト テンプレート、ウィジェット タイプごとに 1 回。

これは非常にクリーンでわかりやすいデザインのように見えますが、ネイティブ UI 設計の観点からすると、このようなことを行う方法の例が見つからない理由がわかりません。

4

1 に答える 1

11

ウィジェット システムの設計の一部を具体化しましたが、実際にはウィジェットの設計方法を示しただけです。もう 1 つの部分は、Jinja でウィジェットを使用する方法です。

たとえば、Jinja マクロを使用してウィジェットを定義できます。ファイル「mywidget.html」を作成して使用...

{% macro css() -%}
    .mywidget {
         css: goes_here;
    }
{% endmacro %}

{% macro widget() -%}
    <div class="mywidget">
        <!-- structure goes here -->
    </div>
{% endmacro %}

{% macro script() -%}
    $( ".mywidget" ).addFunctionality(stuff)
{% endmacro %}

次に、このウィジェットを使用する HTML で、次のことができます...

{% import 'mywidget.html' as mywidget %}

...
<html>
<head>
    <style>
        {{ mywidget.css() }}
    </style>
<head>
<body>
    {{ mywidget.body() }}

    <script>
        {{ mywidget.script() }}
    </script>
</body>
</html>

もちろん、ここでの問題は、すべてのウィジェットをさまざまな領域に手動で配置する必要があることです。多数のウィジェットを取得すると、それらを追跡するのが難しくなる可能性があります。たとえば、mywidget.script()コードを複数回作成すると、イベントが重複して発生する可能性があります。

そしてもちろん、最終的なソリューションをレンダリングするコンテキストの一部として Python オブジェクトをいつでも持つことができます。注意すべき重要なことは、Jinja はテンプレートからテキストをレンダリングするだけであるということです。テンプレートは HTML テンプレートである必要さえありません。Jinja を使用してプレーン テキストの電子メールを表示できます。したがって、ライブラリの作成者がこの種の「ウィジェット」システムを作成しようとして、その結果によって全員が満足することを期待することは想像しにくいでしょう。サポートが必要なほど複雑な機能を使用してライブラリの複雑さを増すのはなぜですか (特に、Jinja はそのようなフレームワークを構築するためのツールを人々に提供しているため)。

于 2013-10-22T20:02:41.487 に答える