I want to show Components in a tabs , so first of all create few components. In this project we have three components, First View Component public class AllViewComponent : ViewComponent { private readonly UserManager<ApplicationUser> _userManager; public AllViewComponent(UserManager<ApplicationUser> userManager) { _userManager = userManager; } public async Task<IViewComponentResult> InvokeAsync() { List<StudentViewModel> allUsers = new List<StudentViewModel>(); var items = await _userManager.Users.ToListAsync(); foreach (var item in items) { allUsers.Add(new StudentViewModel {Id=item.Id, EnrollmentNo = item.EnrollmentNo, FatherName = item.FatherName, Name = item.Name, Age = item.Age, Birthdate = item.Birthdate, Address = item.Address, Gender = item.Gender, Email = item.Email }); }
In previous article, we have already seen about GroupItemsPage. Now, if you want to customize it. Your data source file exist in DataModel folder. Open SampleData.Json file , which is inside in it. Your file look like.
If you run this code , default output will appear on your window screen. Look Like
Change first Group1-item1 picture using above mentioned file. You can change here, for change Item image , which is shown in first tile.
{
"UniqueId": "Group-1-Item-1",
"Title": "Item Title: 1",
"Subtitle": "Item Subtitle: 1",
"ImagePath": "LightGray.png",
"Description" : "Curabitur class aliquam vestibulum nam curae maecenas sed integer cras phasellus",
"Content" : "About first "
},
Change ImagePath for changing image. Before change , must take single image file into your solution explorer.
After change your code will look like
{
"UniqueId": "Group-1-Item-1",
"Title": "Item Title: 1",
"Subtitle": "Item Subtitle: 1",
"ImagePath": "jacob.jpg",
"Description" : "Curabitur class aliquam vestibulum nam curae maecenas sed integer cras phasellus",
"Content" : "About first "
},
Comments
Post a Comment