• 0
brunnengi

Как сделать буквы разного цвета?

Вопросы

Здравствуйте

 

Появилась задача сделать надписи так, что бы цвет букв в одном слове был разный, как на картинке например

19997_colored_text.png

Но так и не нашел решения. Делать слова по одной букве тоже не вариант. 

  • Как поступить, какой есть выход?
  • Может кто то уже делал и есть наработки?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

8 ответов на этот вопрос

  • 0

Добрый вечер,

 

Такую надпись можно решить несколькими способами в зависимости от дополнительных условий:

  • Будет ли меняться текст надписи или нет?

В зависимости от этого есть четыре решения:

 

I. Текст надписи не допускает изменений

В этом случае проще всего сделать картинку с этим текстом и использовать ее в вашем приложении. Где нужно отобразить, использовать TImage.

 

II. Текст надписи может изменяться

Тут два решения:

1. Используем набор TText или TLabel. Для отображения групп последовательных символов одного цвета используем отдельный контрол TLabel или TText. Каждую группу раскрашиваем требуемым образом через настройки контролов.

На скриншотах ниже, я использовал контейнер TLayout и складываю туда несколько объектов TText с выравниванием по левому краю.

post-1-0-18347500-1395762251.pngpost-1-0-26711800-1395762251.png

2. Рисовать надпись вручную с использование TTextLayout. Этот способ сложнее, но зато универсальнее и эффективнее. Используя TTextLayout по очереди отрисовываем все буквы с нужными цветами и параметрами.

3. На основе решения 2 в этой части, сделать свой компонент.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
  • 0

Текст будет меняться, в течении всего времени использования программы.

Вариант с общим Layout и выравниванием по какому либо краю, это то что я тоже пытался сделать, как только понял что символам нельзя задать цвет по отдельности.

Но вы, наверное, так же как и я, заметили, что между буквами не одинаковое расстояние, что конечно сильно бросается в глаза.

 

Вариант номер два звучит отлично. Я бы хотел использовать его.

Но работа демо по TTextLayout оказалась крайне не стабильна.

Я запускаю из под Windows 8. 

Что бы само приложение не "покрывалось" артефактами (из-за optimus'а), я ставлю FMX.Types.GlobalUseDirect2D := false;

Но при добавление атрибутов ничего не меняется (да и в чистом виде в демо ничего не происходит).

Если же не много поиграться с Global, то можно добиться того, что шрифт будет менять на жирный. Цвет категорически менять не хочет.

 

Как добиться чтобы Демо работала, на Windows 8?

Может надо еще какие нибудь глобальные переменные изменить?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
  • 0

Прошу помощи. Вопрос не решен.

Демо не работает как надо.

Куда плыть?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
  • 0

Плыть в направлении использования TTextLayout. При отключении Direct2D канвы, включается по дефолту GDI+, в которой нету поддержки атрибутов. О чем указано в официальной документации.

 

Однако, вы можете применять TTextLaoyut не в целом ко всему текстом с атрибутами, а к частям, имеющим одинаковый цвет и стиль. То есть получаете размеры каждой части в заданных настройках текста, а затем по очереди выводи эти части.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
  • 0

Плыть в направлении использования TTextLayout. При отключении Direct2D канвы, включается по дефолту GDI+, в которой нету поддержки атрибутов. О чем указано в официальной документации.

 

Однако, вы можете применять TTextLaoyut не в целом ко всему текстом с атрибутами, а к частям, имеющим одинаковый цвет и стиль. То есть получаете размеры каждой части в заданных настройках текста, а затем по очереди выводи эти части.

Мне кажется есть другой вариант. Delphi ведь написан в Delphi. И собственно редактор кода умеет выводить текст разного цвета и стиля написания. Если я правильно понял - это "TEditControl". Почему нельзя вынести данный контрол на всеобщее использование?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
  • 0

оболочка не написана с использованием firemonkey. как уже писали выше просто делай строку из TLabel в цикле и раскрашивай как тебе надо буквы. 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
  • 0

Пример отрисовки текста, в том числе и с разноцветными буквами: Как вывести (отрисовать) текст по произвольной дуге

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Похожий контент

    • От slav_z
      Как сделать текст с подобными атрибутами? Очень просто!
      (Цвет текста не работает в XE8) Вот весь код:
      unit Unit1; interface uses System.SysUtils, System.Types, System.UITypes, System.UIConsts, System.Classes, System.Variants, FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs, FMX.Controls.Presentation, FMX.StdCtrls, FMX.Objects, FMX.TextLayout; type TForm1 = class(TForm) Button1: TButton; Text1: TText; procedure Button1Click(Sender: TObject); private { Private declarations } public { Public declarations } end; var Form1: TForm1; implementation {$R *.fmx} type TTextAccess = class(TText); procedure ClearTextAttribute(Text: TText); begin TTextAccess(Text).Layout.ClearAttributes; end; procedure AddTextAttribute(Text: TText; Pos,Length: Integer; FontStyles: TFontStyles; FontColor: TAlphaColor); var Font: TFont; begin Font:=TFont.Create; Font.Assign(Text.Font); Font.Style:=FontStyles; TTextAccess(Text).Layout.AddAttribute( TTextRange.Create(Pos,Length), TTextAttribute.Create(Font,FontColor)); end; procedure TForm1.Button1Click(Sender: TObject); begin AddTextAttribute(Text1,10,17,[TFontStyle.fsBold],claRed); AddTextAttribute(Text1,34,8,[TFontStyle.fsUnderline],claBlue); AddTextAttribute(Text1,47,8,[TFontStyle.fsStrikeOut],claGreen); Text1.Repaint; end; end.  
    • От ra.eremeev
      Добрый день!
      Нуждаюсь в помощи.
      Необходимо в TText вывести текст в Unicode, содержащий смайлы.
      На iOS проблем нет - смайлы отображаются. 
      На Android - монохромные значки (залитые черным) - .
      При этом, если выводить в ListView (через TListItemText), то смайлы выходят и на Android. Шрифт при этом тот же, что и для TText. 
      Но необходимо именно в TText
      Помогите, пожалуйста, как вывести смайлы на Andorid в TText?
       
    • От Tumaso
      Столкнулся со следующей проблемой - TImage игнорирует установленные значения XRadius и YRadius у TRectangle (10.1 Berlin with update 2)
       
      Суть - мне необходимо, чтобы у TRectangle углы были немного скругленные, для этого я устанавливаю XRadius и YRadius. Внутри TRectangle расположен TImage (левый верхний угол 0,0, ширина и высота совпадают с размерами TRectangle). Когда я загружаю картинку в TImage (что в дизайнере, что программно), получается что TImage отображается с прямыми углами, игнорируя XRadius и YRadius своего родителя. Свойство ClipChildren у TRectangle установлен.
      Как сделать так, чтобы TImage скруглялся по углам? Что интересно, TCircle в этом плане работает, обрезая TImage.
    • От Роман Фил
      Привет Всем уважаемые! 
      Пытаюсь сделать растягивание по содержимому компонента. Как это реализовано в мессенджерах типа WhatsApp если большой текст то растягивает (выделяется) по содержимому большое поле, если короткий то малое. 
        Text2.Text := Memo1.Lines.Strings[4];   text2.Height := canvas.TextHeight(Text2.Text); //по высоте строки меняется т.к. там и есть одна строка в TText просто переносится WordWrap визуально.   text2.Height:=canvas.TextWidth(text2.Text); //  - так чушь  Как это вообще реализовано кто нибудь сталкивался?

    • От Роман Фил
      Привет ребят, созрел такой вопрос который меня мучает ! Вобщем пытаюсь загрузить картинку по прямой слыке с сервера. Картинка не грузится, не сохраняется не отображается. 
      Конечная платформа - Андроид. Пишу на Delphi xe 10 seatle.
      Что я делаю? при нажатии на сам компонент TImage (созданный динамически), должна грузится картинка по адресу преждевременно записанное в hint (TImage) при создании вида (http://блаблабла.jpg)
      Раньше код ниже работал сейчас нет не пойму что не так. Почему стал ковырять? потому что форма встает колом при загрузке изображений.
       
      var s: string; fs: TFileStream; begin fs := TFileStream.Create(tpath.Combine(tpath.GetDownloadsPath, 'load.jpg'), fmCreate); NetHTTPClient1.Get((Sender as TImage).Hint, fs); fs.Free; (Sender as TImage).MultiResBitmap.Bitmaps[1].LoadFromFile (tpath.Combine(tpath.GetDownloadsPath, 'load.jpg')); подключал еще pas нашел на этом форуме FMX.Features.Bitmap.Helpers.pas
      (Sender as TImage).MultiResBitmap.Bitmaps[1].LoadFromUrl ((Sender as TImage).Hint); как проще сделать посоветуете чтоб и грузилось и форма не висла?
    • От Anasazi
      Всем доброго времени суток. Возникла необходимость решить такую задачу: в таблице базы MySQL хранится список изображений и их URL. Необходимо получить этот список массивом. Затем загрузить изображения и поочередно с интервалом показать их в TImage.
      Понимаю, что получить список изображений правильнее при помощи PHP скрипта, но в каком виде скрип должен вернуть данные, чтобы в Delphi получить из них массив не знаю.
      Раньше для получения изображений использовал такую процедуру. Но вопрос, где хранить изображения перед демонстрацией их в TImage? Создавать несколько MemoryStream?
      procedure LoadWebImage(url: string; image: TBitmap);
      var
        idhttp : TNetHTTPClient;
        ms : TMemoryStream;
      begin
       IdHTTP := TNetHTTPClient.Create(nil);
        ms := TMemoryStream.Create;
        try
          idhttp.Get(url, ms);
          ms.Position := 0;
          image.LoadFromStream(ms);
        finally
          ms.Free;
          idhttp.Free;
        end;
      end;
    • От denprox
      Доброго времени суток! Подскажите, как узнать оригинальный размер картинки, загруженной в TImage ?
    • От Error
      *** Небольшой обмен опытом ***
      Вижу что вопросы о размере текста довольно частые, поделюсь своими наработками.
      function CalcTextSize(Text: string; Font: TFont; Size: Single = 0): TSizeF;
      Функция для расчета размера прямоугольника, занимаемого однострочным текстом.
      Параметры:
      Text - Текст Font - Шрифт с которым будет выводиться текст Size - если 0, то Font.Size будет использоваться из Font, иначе из данного параметра Исходный код:
      uses System.Types, FMX.Types, FMX.Graphics, FMX.TextLayout, System.Math, System.SysUtils; function CalcTextSize(Text: string; Font: TFont; Size: Single = 0): TSizeF; var TextLayout: TTextLayout; begin TextLayout := TTextLayoutManager.DefaultTextLayout.Create; try TextLayout.BeginUpdate; try TextLayout.Text := Text; TextLayout.MaxSize := TPointF.Create(9999, 9999); TextLayout.Font.Assign(Font); if not SameValue(0, Size) then begin TextLayout.Font.Size := Size; end; TextLayout.WordWrap := False; TextLayout.Trimming := TTextTrimming.None; TextLayout.HorizontalAlign := TTextAlign.Leading; TextLayout.VerticalAlign := TTextAlign.Leading; finally TextLayout.EndUpdate; end; Result.Width := TextLayout.Width; Result.Height := TextLayout.Height; finally TextLayout.Free; end; end;   function FontSizeForBox(Text: string; Font: TFont; Width, Height: Single; MaxFontSize: Single = cMaxFontSize): Integer;
      Функция возвращающая максимально возможный размер шрифта, для текста вписанного в заданный прямоугольник.
      Параметры:
      Text - Текст Font - Шрифт с которым будет выводиться текст Width, Height - Ширина и высота прямоугольника MaxFontSize - Максимально возможный размер шрифта Исходный код:
      uses System.Types, FMX.Types, FMX.Graphics, FMX.TextLayout, System.Math, System.SysUtils; const cMaxFontSize = 512; function FontSizeForBox(Text: string; Font: TFont; Width, Height: Single; MaxFontSize: Single = cMaxFontSize): Integer; var Size, Max, Min, MaxIterations: Integer; Current: TSizeF; begin Max := Trunc(MaxFontSize); Min := 0; MaxIterations := 20; repeat Size := (Max + Min) div 2; Current := CalcTextSize(Text, Font, Size); if ((Abs(Width - Current.Width) < 1) and (Width >= Current.Width)) and ((Abs(Height - Current.Height) < 1) and (Height >= Current.Height)) then break else if (Width < Current.Width) or (Height < Current.Height) then Max := Size else Min := Size; Dec(MaxIterations); until MaxIterations = 0; Result := Size; end; ---
      Также данные функции можно найти в этом юните
    • От sviat9440
      Почему в 10.1 цвет надписи тянется из стиля, хотя в StylledSettings галочка FontColor отключена?

    • От Axbor
      Как исправит такой косяк с отображением текста TText? Если видно, там остатки от текста отображаются. Платформа андроид, Rad Studio XE 10.

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу