So greifen Sie auf Text in Vektor Drawables zu oder übersetzen ihn

Question

Ich habe eine benutzerdefinierte view, die eine drawable anzeigt und Berührungen erkennt. Es hat eine Reihe von drawable Schichten, von denen einige Text enthalten, beispielsweise

ich jedes SVG Vektor-Grafik umgewandelt haben in eine vectordrawable und wollen eine Ressource sein, damit der Text in der Lage sein, so kann ich verschiedene Übersetzungen ersetzen.

Der SVG XML-Code für die oben 'Hallo Box': -

<svg 
    width="800" 
    height="400" 
    viewBox="0 0 800 400.00001" 
    id="svg5772" 
    version="1.1" 
    inkscape:version="0.91 r13725" 
    sodipodi:docname="HELLO in a box.svg"> 
    <defs 
    id="defs5774" /> 
    <sodipodi:namedview 
    id="base" 
    pagecolor="#ffffff" 
    bordercolor="#666666" 
    borderopacity="1.0" 
    <rect 
     style="opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" 
     id="rect6320" 
     width="468.57144" 
     height="128.57143" 
     x="174.28572" 
     y="786.64795" 
     rx="0" 
     ry="0" /> 
    <text 
     xml:space="preserve" 
     style="font-style:normal;font-weight:normal;font-size:40px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" 
     x="348.57141" 
     y="869.50507" 
     id="text6322" 
     sodipodi:linespacing="125%"><tspan 
     sodipodi:role="line" 
     id="tspan6324" 
     x="348.57141" 
     y="869.50507">HELLO!!!</tspan></text> 
    </g> 
</svg> 

... wandelt diese vectordrawable xml: -

<?xml version="1.0" encoding="utf-8"?> 
<vector xmlns:android="http://schemas.android.com/apk/res/android" 
    android:viewportWidth="800" 
    android:viewportHeight="400" 
    android:width="800dp" 
    android:height="400dp"> 
    <group 
     android:translateY="-652.3621"> 
     <path 
      android:pathData="M174.28572 786.64795l468.57144 0 0 128.57143 -468.57144 0z" 
      android:strokeWidth="2" 
      android:fillColor="#ffffff" 
      android:strokeLineJoin="round" 
      android:strokeLineCap="round" 
      android:strokeMiterLimit="4" 
      android:strokeColor="#000000" /> 
     <path 
      android:pathData="M374.72375 869.50507l-3.86718 0 0 -14.23829 -14.51172 0 0 14.23829 -3.86719 0 0 -29.08204 3.86719 0 0 11.40625 14.51172 0 0 -11.40625 3.86718 0 0 29.08204z" 
      android:strokeLineCap="butt" 
      android:fillColor="#000000" 
      android:strokeLineJoin="miter" /> 
     <path 
      android:pathData="M401.71594 869.50507l-19.16015 0 0 -29.08204 19.16015 0 0 3.4375 -15.29297 0 0 7.96875 15.29297 0 0 3.4375 -15.29297 0 0 10.80079 15.29297 0 0 3.4375z" 
      android:strokeLineCap="butt" 
      android:fillColor="#000000" 
      android:strokeLineJoin="miter" /> 
     <path 
      android:pathData="M426.26672 869.50507l-18.39843 0 0 -29.08204 3.86718 0 0 25.64454 14.53125 0 0 3.4375z" 
      android:strokeLineCap="butt" 
      android:fillColor="#000000" 
      android:strokeLineJoin="miter" /> 
     <path 
      android:pathData="M448.53235 869.50507l-18.39844 0 0 -29.08204 3.86719 0 0 25.64454 14.53125 0 0 3.4375z" 
      android:strokeLineCap="butt" 
      android:fillColor="#000000" 
      android:strokeLineJoin="miter" /> 
     <path 
      android:pathData="M473.6886 843.76288q1.77734 1.95312 2.71484 4.78515 0.95703 2.83204 0.95703 6.42579 0 3.59375 -0.97656 6.44531 -0.95703 2.83203 -2.69531 4.72656 -1.79688 1.97266 -4.25781 2.96875 -2.44141 0.99609 -5.58594 0.99609 -3.06641 0 -5.58594 -1.01562 -2.5 -1.01563 -4.25781 -2.94922 -1.75781 -1.93359 -2.71485 -4.74609 -0.9375 -2.8125 -0.9375 -6.42578 0 -3.55469 0.9375 -6.36719 0.9375 -2.83203 2.73438 -4.84375 1.71875 -1.91406 4.25781 -2.92969 2.5586 -1.01562 5.56641 -1.01562 3.125 0 5.60547 1.03515 2.5 1.01563 4.23828 2.91016zm-0.35156 11.21094q0 -5.66407 -2.53907 -8.73047 -2.53906 -3.08594 -6.93359 -3.08594 -4.43359 0 -6.97266 3.08594 -2.51953 3.0664 -2.51953 8.73047 0 5.72265 2.57813 8.76953 2.57812 3.02734 6.91406 3.02734 4.33594 0 6.89453 -3.02734 2.57813 -3.04688 2.57813 -8.76953z" 
      android:strokeLineCap="butt" 
      android:fillColor="#000000" 
      android:strokeLineJoin="miter" /> 
     <path 
      android:pathData="M489.64563 840.42303l-0.50781 21.07422 -3.32032 0 -0.54687 -21.07422 4.375 0zm-0.19531 29.08204l-3.98438 0 0 -4.1211 3.98438 0 0 4.1211z" 
      android:strokeLineCap="butt" 
      android:fillColor="#000000" 
      android:strokeLineJoin="miter" /> 
     <path 
      android:pathData="M505.42688 840.42303l-0.50781 21.07422 -3.32032 0 -0.54687 -21.07422 4.375 0zm-0.19531 29.08204l-3.98438 0 0 -4.1211 3.98438 0 0 4.1211z" 
      android:strokeLineCap="butt" 
      android:fillColor="#000000" 
      android:strokeLineJoin="miter" /> 
     <path 
      android:pathData="M521.20813 840.42303l-0.50781 21.07422 -3.32032 0 -0.54687 -21.07422 4.375 0zm-0.19531 29.08204l-3.98438 0 0 -4.1211 3.98438 0 0 4.1211z" 
      android:strokeLineCap="butt" 
      android:fillColor="#000000" 
      android:strokeLineJoin="miter" /> 
    </group> 
</vector> 

Es sieht sehr wie jeden Buchstaben "HALLO!!!" Text wird in eine path konvertiert, um direkt auf die canvas gezeichnet werden?

Also meine Frage ist, gibt es alternative Möglichkeit, die Vektorgrafik mit Text auf einem canvas anzuzeigen und daher eine Ressource für den Textteil zu verwenden? oder bleibe ich dabei, verschiedene Grafiken für jede Sprache zu erstellen?

Answer 1

Ihr Fazit ist richtig.

Vektorzeichen sind vollständig pfadbasiert. Dies ist der Grund für ihre Animation, weil nur ein Pfad geändert wird. Daher nehmen sie keinen Text oder Bild als Eingabe.

Eine Option könnte .svg durch Text (etwas Werkzeug vielleicht?) Erhalten und es dann in xml für jede Sprache umwandeln. Wenn Sie auf eine größere Lokalisierung abzielen, ist Vektor-Drawable möglicherweise nicht der richtige Ansatz.

Answer 2

Sie müssen einen Ansatz verwenden, der den lokalisierbaren Inhalt vom Zeichensatz trennt.

Es ist nicht klar, was genau Sie tun, aber wenn Sie zum Beispiel benutzerdefinierte Schaltflächen haben möchten, dann sollten Sie die VectorDrawable nur das benutzerdefinierte Schaltfläche Design sein. Verwenden Sie dann entweder den Zeichensatz als Hintergrund für eine TextView, oder überlagern Sie den Textteil als TextView über eine ImageView.