在调度程序上更改列宽答案

【问题标题】：Changing column widths on a scheduler在调度程序上更改列宽
【发布时间】：2015-09-14 02:18:51
【问题描述】：

我正在尝试做一些看起来应该相对容易做的事情，尽管我找不到任何关于如何做的资料。

我有一个呈现为 DayView 的 Kendo Scheduler 控件。我只是想改变列的宽度。这是一个屏幕截图：

这是我的 MVC 视图代码：

<div>
    @(Html.Kendo().Scheduler<TechScheduler.Infrastructure.ViewModels.ScheduleEventModel>()
    .Name("scheduler")
    .Editable(true)
    .Date(DateTime.Now)
    .StartTime(new DateTime(DateTime.Now.AddYears(-1).Year, DateTime.Now.AddYears(-1).Month, DateTime.Now.AddYears(-1).Day, 0, 0, 0))
    .EndTime(new DateTime(DateTime.Now.AddYears(1).Year, DateTime.Now.AddYears(1).Month, DateTime.Now.AddYears(1).Day, 23, 59, 59))
    .WorkDayStart(new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, 0, 0, 0))
    .WorkDayEnd(new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, 23, 59, 0))
    .WorkWeekStart(0)
    .WorkWeekEnd(7)
    .MajorTick(60)
    .Height(600)                
    .Timezone("Etc/UTC")
    .Events(e =>
    {
        e.ResizeEnd("scheduler_resizeEnd");
        e.DataBound("scheduler_dataBound");
        e.Edit("scheduler_edit");
    })
    .Views(views =>
    {
        views.DayView(z =>
        {
            z.StartTime(new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, 0, 0, 0));
            //z.EndTime(new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, 23, 59, 59));
            z.MajorTick(60);
            z.ShowWorkHours(false);
            z.Footer(false);
            z.EventTemplateId("evenTemplate");
        });            
    })
    .Group(group => group.Resources("Attendees").Orientation(SchedulerGroupOrientation.Horizontal))
    .Resources(resource =>
    {
        resource.Add(m => m.Attendees)
            .Title("Attendees")
            .Name("Attendees")
            .Multiple(true)
            .DataTextField("TechnicianName")
            .DataValueField("TechnicianId")
            .DataColorField("Color")
            .DataSource(ds => ds.Read("GetTechnicians", "Ajax"));
    })
    .DataSource(d => d.Model(m =>
            {
                m.Id(f => f.MeetingID);
                m.RecurrenceId(f => f.RecurrenceID);
                m.Field(f => f.Title).DefaultValue("No title");
            })
            .Read("GetSchedule", "Ajax")
    )
    )
</div>

有一个ColumnWidth 属性，但它在属性正下方的注释中说它仅在时间线视图中受支持。

如何使我的列宽变小？

【问题讨论】：

减小整个调度器的宽度是一种选择吗？列的默认宽度是相对于整个宽度的
@chiapa - 我试过了。它使调度程序控件本身更小，但列的宽度完全相同。如果您需要查看，我可以发布屏幕截图。
这很奇怪，我想看看！如果有的话，你能发布你的活动模板代码和相应的 CSS 吗？

标签： c# asp.net-mvc kendo-ui kendo-scheduler column-width

【解决方案1】：

我能够弄清楚这一点。万一其他人有这个问题，我用这个 CSS 代码来改变大小：

.k-scheduler-content .k-scheduler-table,
.k-scheduler-header .k-scheduler-table {
    width: @(TechScheduler.Infrastructure.Technicians.GetNumberOfTechnicians() * 100)px;
}

我有一个名为GetNumberOfTechnicians() 的方法，它基本上返回我的调度程序上的列数，然后我将它乘以我希望每列的像素数（100 像素）。到目前为止，我的所有测试似乎都运行良好！

【讨论】：