How to bind TextBox.InnerLeftContent/InnerLeftContent to an image?

[Bo-Liu-BL]

Hi experts,

I want to show an icon on the left part of the text box (more accurately, the left part of an AutoCompleteBox).
It is defined as type object, so it should be able to be bound to an image.
Could you please show me any clue? I struggled on this for quite a while but have no solution.

The following is a captured example to show a search icon:

There have been some discussions.
For example, it was ever mentioned in the following thread:
#4022
"I found InnerLeftContent and InnerRightContent. If I set InnerRightContent to my own button it seem to work"
But it wasn't show how to achieve that.

Its definition:
https://reference.avaloniaui.net/api/Avalonia.Controls/TextBox/62B79C09

Thank you very much!

[stevemonaco]

Not sure what you might be doing, but you should specify the control for the icon:

<AutoCompleteBox Text="Search">
    <AutoCompleteBox.InnerLeftContent>
        <PathIcon RenderTransform="scaley(-1)" Data="M203 213c53 0 96 43 96 96s-43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96zM331 213l106 -106l-32 -32l-106 106v17l-6 6c-24 -21 -56 -33 -90 -33c-77 0 -139 61 -139 138s62 139 139 139s138 -62 138 -139c0 -34 -12 -66 -33 -90l6 -6h17z" />
    </AutoCompleteBox.InnerLeftContent>
</AutoCompleteBox>

I'm using a <PathIcon> here, but you could use an <Image> instead.

It's also a new feature on AutoCompleteBox for 11.1, so you should be using 11.1.0-beta2.

[Bo-Liu-BL]

I really appreciate your quick reply, @stevemonaco . It DID resolve my issue. Mark it as the answer.