Как использовать "якорь" со связанным текстом (который не является связываемым)
Из этого вопроса ( Гиперссылка внутри поля меток в Vaadin 12) я смог использовать HTML-компонент Vaadin для создания пользовательского HTML-кода (и он работал нормально, включая вставку ссылок Ahref и т. Д.)
Тем не менее, Vaadin предоставляет компонент "Якорь", который представляется гораздо более мощным (и потенциально более безопасным) способом создания ссылок, которые можно использовать для перехода к другим классам, которые я создал, или к внешнему веб-сайту (или даже для загрузки сгенерированных динамически). данные в потоковом режиме).
Тем не менее, что если я хочу, чтобы и обычный текст, похожий на метку, и ахорную ссылку отображались в одном абзаце? Например, в "нормальном HTML" я мог бы просто сделать это:
<p>
This is my normal text.
Download <a href="/resources/excelTemplate.xlsx" download> this Excel file</a>
and follow the instructions therein
</p>
и это создаст ссылку где-то внутри моего <p>...</p> параграф. Как я могу сделать это в Vaadin с объектом Anchor? Лучшее, что я придумала до сих пор, - это использование горизонтальной компоновки, а затем добавление метки, ахора, а затем другой метки - но это действительно очень уродливо и технически не дает того же эффекта (оно не будет правильно оборачиваться)..) Другой вариант - НЕ использовать "Якорь", а просто использовать компонент "HTML" и просто создавать ссылки везде, но это тоже кажется немного уродливым (хотя я полагаю, что это хороший обходной путь). (Я предполагаю, что я могу вызвать любой пользовательский интерфейс, который я создаю, вставив ссылки url в вызовы ahref....) Мысли о "правильном Java Vaadin" способ сделать это?
2 ответа
Vaadin 10+ предлагает вам (по крайней мере) три способа справиться с этим делом. Вы упомянули два из..
Составьте состав компонентов в Java. Вместо VerticalLayout вы можете обернуть содержимое в Div и использовать текстовый компонент также в Div вместо Label. Вы можете сделать этот вид пользовательского компонента, расширяя Composite.
Второй вариант - использовать HTML-компонент, как вы упомянули.
Третий вариант - создать собственный HTML-шаблон полимера и подключиться к нему с помощью класса PolymerTemplate. Это приведет к тому, что пользовательский компонент будет вести себя как пользовательский компонент первого параметра. Это просто другой способ реализации.
Какой из трех является правильным способом. С точки зрения структуры все они. Какой из них подходит вам, зависит от ваших предпочтений и применения.
Paragraph p = new Paragraph("para");
Anchor a = new Anchor("go", "www.go.com");
p.add(a);
p.addClickListener(e-> UI.getCurrent().navigate(a.getHref()));