This is a migrated thread and some comments may be shown as answers.

DropDownList style exactly like Demo Aplication

2 Answers 34 Views
DropDownList
This is a migrated thread and some comments may be shown as answers.
Adriel
Top achievements
Rank 1
Adriel asked on 18 Mar 2015, 02:25 AM
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.

2 Answers, 1 is accepted

Sort by
0
Adriel
Top achievements
Rank 1
answered on 19 Mar 2015, 03:56 PM
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.
0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 20 Mar 2015, 12:48 PM
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
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
DropDownList
Asked by
Adriel
Top achievements
Rank 1
Answers by
Adriel
Top achievements
Rank 1
Dess | Tech Support Engineer, Principal
Telerik team
Share this question
or