ASP.NET Core web uygulamanızda sunumları görüntülemek veya katıştırmak için bir PowerPoint Görüntüleyici mi arıyorsunuz? Cevabınız evet ise, bu makaleyi okumaya devam edin ve basit bir ASP.NET Core PowerPoint Viewer oluşturmayı ve C# kullanarak PPT/PPTX sunularını görüntülemeyi öğrenin. Öyleyse başlayalım.
ASP.NET PowerPoint Viewer’ın Özellikleri
ASP.NET PowerPoint Görüntüleyicimiz, sunum slaytlarını PNG görüntüleri olarak işlemek için Aspose.Slides for .NET API’sini kullanacaktır. Slaytlar oluşturulduktan sonra Bootstrap Carousel’i kullanarak onları göstereceğiz. Aşağıdakiler uygulamanın özellikleri olacaktır:
- PowerPoint (PPT/PPTX) sunumlarına göz atın ve görüntüleyin.
- Sayfa yüklendiğinde görüntülenecek varsayılan PowerPoint dosyasını ayarlayın.
- Slaytlar arasında gezinmek için kaydırıcı.
ASP.NET Core’da PowerPoint Viewer Oluşturma Adımları
Aşağıda, ASP.NET Core’da bir PowerPoint Görüntüleyici oluşturmak için bazı kolay adımlar verilmiştir.
- Visual Studio’da yeni bir ASP.NET Core Web Uygulaması oluşturun.
- NuGet Paket Yöneticisi’ni açın ve Aspose.Slides for .NET paketini kurun.
- Sırasıyla PowerPoint dosyalarını ve işlenmiş slaytları tutmak için wwwroot’ta Sunumlar ve Slaytlar klasörleri oluşturun.
Kök klasörde “Yardımcılar” adıyla yeni bir klasör oluşturun.
Sunum slaytlarının bilgilerini depolamak için “Yardımcılar” klasöründe “Slide” adıyla yeni bir sınıf oluşturun.
public class Slide
{
public int SlideNumber { get; set; }
public string Path { get; set; }
}
- “HomeController.cs” dosyasını açın ve kodunu aşağıdakiyle değiştirin (Dizin eyleminde varsayılan PowerPoint dosyasının adını güncelleyin).
public class HomeController : Controller
{
public List<Helper.Slide> slides;
public IHostingEnvironment _env;
public HomeController(IHostingEnvironment env)
{
_env = env;
}
[HttpGet]
public ActionResult Index(string fileName)
{
slides = new List<Helper.Slide>();
if (fileName == null)
{
// Sayfa yüklemede varsayılan PowerPoint dosyasını göster
slides = RenderPresentationAsImage("presentation.pptx");
}
else
{
slides = RenderPresentationAsImage(fileName);
}
return View(slides);
}
public List<Helper.Slide> RenderPresentationAsImage(string FileName)
{
var webRoot = _env.WebRootPath;
// PowerPoint sunumunu yükleyin
Presentation presentation = new Presentation(Path.Combine(webRoot, "Presentations", FileName));
var slides = new List<Helper.Slide>();
string imagePath = "";
// Sunum slaytlarını kaydedin ve görüntüleyin
for (int j = 0; j < presentation.Slides.Count; j++)
{
ISlide sld = presentation.Slides[j];
Bitmap bmp = sld.GetThumbnail(1f, 1f);
imagePath = Path.Combine(webRoot, "Slides", string.Format("slide_{0}.png", j));
bmp.Save(imagePath, System.Drawing.Imaging.ImageFormat.Png);
// Listeye ekle
slides.Add(new Helper.Slide { SlideNumber = j, Path = string.Format("slide_{0}.png", j) });
}
return slides;
}
}
- Views/Home/index.cshtml dosyasını açın ve içeriğini aşağıdakiyle değiştirin.
@{
ViewData["Title"] = "PowerPoint Viewer";
}
@{
Layout = null;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Slides Viewer</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div class="container">
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
</button>
<a asp-area="" asp-controller="Home" asp-action="Index" class="navbar-brand">PowerPoint Viewer</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li style="cursor: pointer;"><a data-toggle="modal" data-target="#exampleModal">Browse</a></li>
</ul>
</div>
</div>
</nav>
<br />
<div id="myCarousel" class="carousel slide" data-interval="false">
<div class="carousel-inner" role="listbox" style="width:100%; height: auto !important;">
@for (int i = 0; i < Model.Count; i++)
{
if (i == 0)
{
<div class="item active">
<img src="~/Slides/@Model[i].Path" style="width: 80%; height: auto; margin:auto !important" class="img-responsive " />
<p style="text-align:center;">
<strong> @(Model[i].SlideNumber + 1)/@Model.Count</strong>
</p>
</div>
}
else
{
<div class="item">
<img src="~/Slides/@Model[i].Path" style="width: 80%; height: auto; margin:auto !important" class="img-responsive " />
<p style="text-align:center;">
<strong> @(Model[i].SlideNumber + 1)/@Model.Count</strong>
</p>
</div>
}
}
</div>
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Select a file</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="list-group">
@foreach (string file in System.IO.Directory.EnumerateFiles("wwwroot/Presentations","*"))
{
string fileName = System.IO.Path.GetFileName(file);
@Html.ActionLink(fileName, "Index", "Home", new { fileName = fileName }, new { @class = "list-group-item" })
}
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script src="~/lib/jquery/dist/jquery.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
<script src="~/js/site.min.js" asp-append-version="true"></script>
</body>
</html>
- Uygulamayı oluşturun ve favori tarayıcınızda çalıştırın.
Ayrıca bakınız
Aspose.Slides for .NET için Geçici Lisans Alın
Deneme sınırlamalarından kaçınmak için Aspose.Slides for .NET’in geçici lisansını edinebilirsiniz.
İpucu: Sunumlar için görüntüleme işlemlerinin canlı uygulamasına göz atmak isteyebilirsiniz.