DropDownList style exactly like Demo Aplication

[Adriel]

Hi, I'm trying to achieve a style exactly like the one shown in the demo application (attached image).

I analyzed the sample code, but the style is not in him. Where could I find the code that generates it?

Thank you very much.

[Adriel]

I continued researching. I can not display the list to the right (as in the example image).

Is there any way to use exactly the same style of the demo application? The sample code provided does not generate the list as the image.

Thanks.

[Dess | Tech Support Engineer, Principal]

Hello Adriel,

Thank you for writing.

Note that depending on RadDropDownList location on the screen, its popup will be opened on a way to display entirely. Hence, its location(left, right, top, bottom) may vary. However, you can specify where to position the popup by canceling the PopupOpening event and manually showing it at the desired position. You can find below a sample code including the desired formatting from the attached screenshot:

public Form1()
{
    InitializeComponent();

    this.radDropDownList1.ListElement.AutoSizeItems = true;
    this.radDropDownList1.ThemeName = "TelerikMetro";
    this.radDropDownList1.ItemDataBound += radDropDownList1_ItemDataBound;
    this.radDropDownList1.DataSource = this.employeesBindingSource;
    this.radDropDownList1.DisplayMember = "LastName";
    this.radDropDownList1.DropDownStyle = Telerik.WinControls.RadDropDownStyle.DropDownList;
    this.radDropDownList1.DropDownMinSize = new Size(100, 300);
    this.radDropDownList1.PopupOpening += radDropDownList1_PopupOpening;
}

private void radDropDownList1_PopupOpening(object sender, CancelEventArgs e)
{
    e.Cancel = true;
    this.radDropDownList1.PopupOpening -= radDropDownList1_PopupOpening;
    this.radDropDownList1.DefaultItemsCountInDropDown = 20;
    this.radDropDownList1.DropDownListElement.Popup.Show(new Point(radDropDownList1.PointToScreen(radDropDownList1.Location).X +
               radDropDownList1.Size.Width, radDropDownList1.PointToScreen(radDropDownList1.Location).Y));
    this.radDropDownList1.PopupOpening += radDropDownList1_PopupOpening;
}

private void radDropDownList1_PopupOpened(object sender, EventArgs e)
{
}

private void radDropDownList1_ItemDataBound(object sender, Telerik.WinControls.UI.ListItemDataBoundEventArgs args)
{
    RadListDataItem item = args.NewItem;
    item.Text += " " + (item.DataBoundItem as DataRowView)["FirstName"];

    NwindDataSet.EmployeesRow row = ((item.DataBoundItem as DataRowView).Row as NwindDataSet.EmployeesRow);
    item.TextImageRelation = TextImageRelation.ImageBeforeText;
    item.Image = GetImageFromData(row.Photo);
    item.Font = new Font("Arial", 10, FontStyle.Bold);
}

private bool HasOleContainerHeader(byte[] imageByteArray)
{
    const byte OleByte0 = 21;
    const byte OleByte1 = 28;
    return (imageByteArray[0] == OleByte0) && (imageByteArray[1] == OleByte1);
}

private Image GetImageFromData(byte[] imageData)
{
    const int OleHeaderLength = 78;
    MemoryStream memoryStream = new MemoryStream();
    if (HasOleContainerHeader(imageData))
    {
        memoryStream.Write(imageData, OleHeaderLength, imageData.Length - OleHeaderLength);
    }
    else
    {
        memoryStream.Write(imageData, 0, imageData.Length);
    }
    Bitmap bitmap = new Bitmap(memoryStream);
    return bitmap.GetThumbnailImage(55, 65, null, new IntPtr());
}

private void Form1_Load(object sender, EventArgs e)
{
    this.employeesTableAdapter.Fill(this.nwindDataSet.Employees);
}

I hope this information helps. Should you have further questions, I would be glad to help.

 

Regards,
Dess
Telerik