WPF i Silverlight Designer, omówienie

[This documentation is for preview only, and is subject to change in later releases. Blank topics are included as placeholders.]

WPF i Silverlight Projektant zapewnia obsługę projektowania wizualnego Tworzenie aplikacji WPF i Silverlight. Możesz zbudować interfejsów użytkownika dla aplikacji, przeciągając formanty z Przybornik i ustawianie właściwości w Właściwości okna. Można również edytować XAML bezpośrednio w edytorze XAML. Na poniższej ilustracji przedstawiono WPF i Silverlight Designer i niektóre z jego obsługi systemu windows.

Overview of the WPF Designer

Po uruchomieniu WPF i Silverlight Projektant po raz pierwszy, po lewej stronie są zwinięte okno źródła danych i okno konspektu dokumentu Visual Studio. Jeśli Pokaż i pin karty po lewej stronie widać poprzedniego widoku, który jest przydatny Porozumienie dotyczące korzystania z powierzchni projektu.

Ten temat zawiera następujące sekcje:

  • Widok projektu

  • Widok kod XAML

  • Okno właściwości

  • Okno źródła danych

  • Okno konspektu dokumentu

  • Interfejsy użytkownika interakcyjnego budowania bogatych,

  • Współpraca z Expression Blend

Widok projektu

Widok projektu oferuje powierzchni projektu visual tworzenia formantów WPF i Silverlight i aplikacji. Dzięki niemu renderowania XAML obecnie w widoku kod XAML. Po zmianie formantów na powierzchni projektu XAML umożliwia wyświetlenie aktualizacji w celu odzwierciedlenia zmian. Widok projektu oferuje wiele funkcji rozmieszczania formantów w oknie aplikacji WPF lub strony. Niektóre funkcje projektowania widoku są wyświetlane na poniższej ilustracji.

Design view features in the WPF Designer

Bb514528.collapse_all(pl-pl,VS.110).gifPowiększenie

Element sterujący powiększenia pozwala wielkości powierzchni projektu. Można powiększyć z 10% do 20 x. Ustawienie powiększenia jest zapisywany w pliku .suo rozwiązania.

Bb514528.collapse_all(pl-pl,VS.110).gifPan

Gdy powierzchni projektu jest powiększony, a poziome lub pionowe paski przewijania są wyświetlane, można przesunąć obraz wyświetlanie części powierzchni projektu, które są ukrytej. Naciśnij i przytrzymaj spację, a następnie przeciągnij powierzchni projektu, aby przesunąć obraz.

Bb514528.collapse_all(pl-pl,VS.110).gifDopasowanie do widoku

Nadające się w przycisk Widok pozwala wielkości powierzchni projektu na ekranie dostępne w widoku Projekt. Jest to przydatne, jeśli powiększysz bardzo daleko w lub poza.

Bb514528.collapse_all(pl-pl,VS.110).gifSzyny siatki

Szyny siatki są używane do zarządzania wierszy i kolumn w Grid kontroli. Można tworzyć i usuwać kolumn i wierszy, i można dostosować ich względne szerokości i wysokości. Aby uzyskać więcej informacji, zobacz Jak: dodawanie do siatki wierszy i kolumn.

Bb514528.collapse_all(pl-pl,VS.110).gifLinie siatki

Linie siatki są używane do kontrolowania szerokość i wysokość Grid's kolumn i wierszy. Można dodać nową kolumnę lub wiersz, klikając w szynach powyżej i na lewo od Grid. Aby uzyskać więcej informacji, zobacz Jak: dodawanie do siatki wierszy i kolumn.

Bb514528.collapse_all(pl-pl,VS.110).gifWskaźniki linii siatki.

Wskaźnik siatki jest wyświetlany jako trójkąt w szynie siatki. Podczas przeciągania wskaźnika siatki lub linii siatki, sama szerokości lub wysokości sąsiadujących ze sobą kolumn lub wierszy aktualizacji podczas przesuwania myszy. Aby uzyskać więcej informacji, zobacz Jak: dodawanie do siatki wierszy i kolumn.

Bb514528.collapse_all(pl-pl,VS.110).gifUchwyt przenoszenia

Uchwyt przenoszenia pojawia się w lewym górnym formantu wybranego panelu i pozwala przesunąć na panelu. Kliknij uchwyt przenoszenia, a następnie przeciągnij formant do żądanego położenia na powierzchni projektu. Aby uzyskać więcej informacji, zobacz Jak: Wybierz i Przenieś elementy do powierzchni projektu.

Bb514528.collapse_all(pl-pl,VS.110).gifUchwyty zmiany rozmiaru

Zmienianie rozmiaru uchwyty znajdujące się z zaznaczonych formantów i pozwalają zmieniać rozmiary formantu. Przy zmianie rozmiaru formantu, wartości Szerokość i wysokość zazwyczaj znajdują się do pomocy, dokładnie rozmiar formantu.

Bb514528.collapse_all(pl-pl,VS.110).gifLinie marginesu

Marginesy stanowią kwotę stałych odstęp między krawędzią formantu a krawędzią jego kontenera. Ustaw marginesy formant, klikając jego linii marginesu. Aby uzyskać więcej informacji, zobacz Jak: Ustawianie marginesów dla formantu w projektancie WPF.

Bb514528.collapse_all(pl-pl,VS.110).gifMargines procedur wejścia

Skrótowej margines pojawia się na zaznaczonego formantu, gdy jego margines w ustawione na 0. Kliknij przycisk skrótowej margines ustawić odległość marginesu do odpowiedniej krawędzi kontenera. Aby uzyskać więcej informacji, zobacz Jak: Ustawianie marginesów dla formantu w projektancie WPF.

Bb514528.collapse_all(pl-pl,VS.110).gifSnaplines

Pomoc Snaplines, który można wyrównać formantów względem siebie. Jeśli snaplines są włączone, podczas przeciągania formantu względem innych formantów, snaplines pojawiają się przy krawędzi i tekst niektóre formanty są wyrównane w poziomie lub pionie. Aby uzyskać więcej informacji, zobacz Jak: wyrównać do zarówno linie bazowe tekstu i marginesy.

Bb514528.collapse_all(pl-pl,VS.110).gifPasek informacji

Pasek informacji jest wyświetlany w górnej części widoku Projekt i wyświetla informacje dotyczące problemów z renderowaniem w widoku Projekt. W niektórych przypadkach można kliknąć pasek informacji, aby uzyskać dodatkowe informacje o problemie. Następująca ilustracja pokazuje rozwinięty widok paska informacji.

Information bar details

Bb514528.collapse_all(pl-pl,VS.110).gifPasek zmiany rozmiaru

Gdy przesuwa wskaźnik myszy nad kolei siatki dla Grid formantu, który ma dwa lub więcej kolumn lub wierszy poza z kolei pojawi się pasek zmiany rozmiaru. Pasek zmiany rozmiaru pozwala ustalony zestaw, gwiazdy i opcje zmiany rozmiaru automatyczne Grid wierszy i kolumn. Aby uzyskać więcej informacji, zobacz Jak: rozmiar wierszy i kolumn w formancie siatki.

Bb514528.collapse_all(pl-pl,VS.110).gifGłówny Tag zmiany rozmiaru

Główny, zmiany rozmiaru znacznika pojawia się w prawej dolnej części okna w widoku Projekt, zaznaczone okno. Główny, zmiany rozmiaru znacznika pozwala przełączać rozmiar głównego okna między auto i stałej. Aby uzyskać więcej informacji, zobacz Atrybuty w czasie projektowania.

Widok kod XAML

Rozszerzalny język znaczników aplikacji (XAML) przewiduje słownictwa deklaracyjne, opartych na języku XML określający interfejsu użytkownika danej aplikacji. WPF i Silverlight Projektant zapewnia widok XAML i zsynchronizowane widoku Projekt aplikacji wytopione XAML znaczników. Widok XAML obejmuje IntelliSense, formatowania automatycznego, składni, wyróżnianie i tag nawigacji. Niektóre funkcje XAML są przedstawione na poniższej ilustracji.

XAML view features in the WPF Designer

Bb514528.collapse_all(pl-pl,VS.110).gifPasek podziału w widoku

Pasek podziału w widoku umożliwia sterowanie względne wielkości widok projektu i XAML. Można także wymiana poglądów, określ, czy widok złożony jest poziomy lub pionowy i zwinąć widok albo. Aby uzyskać więcej informacji, zobacz Podzielonego widoku: W tym samym czasie wyświetlanie powierzchni projektu WPF a XAML.

Bb514528.collapse_all(pl-pl,VS.110).gifTechnologia IntelliSense rozszerzenie adiustacji

Oprócz standardowego języka IntelliSense widok XAML obsługuje IntelliSense dla rozszerzeń znaczników. Kiedy wpisz nawias klamrowy otwierający ({) w widoku kod XAML technologii IntelliSense, wyświetlane są rozszerzenia markup dostępne. Podczas pobierania rozszerzenie znaczników z listy IntelliSense pokazuje dostępne atrybuty. Aby uzyskać więcej informacji, zobacz Instruktaż: Edycja XAML w projektancie WPF.

Bb514528.collapse_all(pl-pl,VS.110).gifTag Navigator

Nawigator znacznika pojawia się poniżej widoku XAML i pozwala przejść do dowolnego ze znacznika nadrzędnego aktualnie zaznaczony znacznik w widoku kod XAML. Po przesunięciu wskaźnika myszy nad tag w Nawigatorze tag miniaturę podglądu jest wyświetlana dla tego elementu. Instruktaż: Edycja XAML w projektancie WPF.

Bb514528.collapse_all(pl-pl,VS.110).gifPowiększenie

Pozwala na element sterujący powiększenia rozmiaru widoku XAML. Można powiększyć z 20% do 400%.

Okno właściwości

Okno właściwości umożliwia określanie wartości właściwości formantów w widoku Projekt. Przykład okna właściwości jest pokazany na poniższej ilustracji.

Properties window

U góry okna właściwości ma różne opcje. Aby zmienić nazwę zaznaczonego formantu, umieść kursor w polu Nazwa, a następnie wpisz nazwę. Prawy górny róg Wyświetla podgląd miniatur aktualnie zaznaczonego formantu. Aby wyświetlić listę właściwości, według kategorii lub alfabetycznie, kliknij kategorii przycisk lub Alfabetyczna przycisku. Aby posortować właściwości według źródła, kliknij Sortuj według właściwości źródła przycisku. Aby wyświetlić listę zdarzeń dla formantu, kliknij przycisk zdarzenia przycisku. Aby wyszukać właściwość, rozpoczęcie wpisz nazwę właściwości w wyszukiwania pole. Okno właściwości zawiera właściwości, które pasują do kryteriów wyszukiwania podczas wpisywania.

Po prawej stronie nazwy właściwości w pierwszej kolumnie jest właściwości znacznika. Znacznik właściwości wskazuje, czy istnieje powiązanie danych lub stosowane do właściwości zasobu. Po kliknięciu znacznika właściwości, można otworzyć Konstruktor wiązania danych, Próbniku zasobu lub przejdź do definicji zasobu. Na następującej ilustracji pokazano opcje, które są dostępne po kliknięciu znacznika właściwości stylu.

Bb514528.collapse_all(pl-pl,VS.110).gifKonstruktor wiązania danych

Konstruktor wiązania danych umożliwia tworzenie powiązań danych bez konieczności wpisywania jakichkolwiek XAML. Można utworzyć wiązania do zasobów, kontekstów danych i właściwości elementu. Można także zastosować wartość konwerterów. Aby uzyskać więcej informacji, zobacz Instruktaż: Tworzenie powiązania przy użyciu projektanta WPF danych i Instruktaż: Za pomocą DesignInstance do powiązania danych w Projektancie.

data binding builder

Bb514528.collapse_all(pl-pl,VS.110).gifEdytor marginesu

Edytor margines umożliwia widać każdego ustawienie marginesu, i jak wpływa na położenie formantu. Można również zmienić marginesy dla jednego formantu lub Edytuj marginesy dla kilku formantów za pomocą edytora marginesu. Aby uzyskać więcej informacji, zobacz Jak: Ustawianie marginesów dla formantu w projektancie WPF.

Bb514528.collapse_all(pl-pl,VS.110).gifWybór zasobów

Wybór zasobów pozwala znaleźć i przydzielać zasoby do właściwości w oknie dialogowym właściwości. Można również wyodrębnić ustalonych wartości do zasobów, aby promować ponownego wykorzystywania. Aby uzyskać więcej informacji, zobacz Korzystanie z zasobów.

resource picker

Bb514528.collapse_all(pl-pl,VS.110).gifEdytor pędzla

Edytor pędzla pozwala utworzyć wiele różnych rodzajów pędzle w oknie dialogowym właściwości. Aby uzyskać więcej informacji, zobacz Jak: Tworzenie pędzla za pomocą edytora pędzla.

brush editor

Okno źródła danych

Można szybko zintegrować dane w aplikacji WPF, za pomocą Okno źródła danych. Po ustanowieniu połączenia danych, tabele danych można przeciągnąć na powierzchni projektu i wiązania logikę i dane biznesowe są generowane automatycznie. Można powiązać obiekt ADO.NET Dataset, Model podmiotu danych lub usługi. Aby uzyskać więcej informacji, zobacz Wiązanie formantów WPF do danych w programie Visual Studio.

Data Sources window

Okno konspektu dokumentu

Okno konspektu dokumentu udostępnia hierarchiczny widok dokumentu XAML. Okno konspektu dokumentu do podglądu, zaznacz lub usuń elementy XAML. Przykład okna właściwości jest pokazany na poniższej ilustracji.

Document Outline window

Aby uzyskać więcej informacji, zobacz Przeglądanie hierarchii elementów dokumentu WPF.

Interfejsy użytkownika interakcyjnego budowania bogatych,

W aplikacji WPF Window i Page klasy są wizualne powierzchnie, na których wyświetlić informacje dla użytkownika. Zazwyczaj Tworzenie aplikacji WPF poprzez dodawanie formantów do Window i rozwijanie odpowiedzi na akcje użytkownika, jak kliknięcie myszą lub naciśnięcia klawiszy. A kontroli jest elementem interfejsu użytkownika dyskretnych, który wyświetla dane lub akceptuje dane wejściowe.

Kiedy użytkownik jest coś do sieci Window lub jeden z jego formantów działania generuje zdarzenie. Aplikacja reaguje na te zdarzenia i przetwarza je, gdy one wystąpią. Aby uzyskać więcej informacji, zobacz Jak: tworzenie obsługi zdarzenia prostego.

WPF zawiera wiele formantów, które można dodać do okna: formanty, które wyowietlają pól tekstowych, przycisków, list rozwijanych, przyciski opcji i nawet stron sieci Web. Aby uzyskać listę wszystkich formantów można używać w oknie, zobacz Biblioteka formantów. Istniejący formant nie odpowiadają Twoim potrzebom, WPF obsługuje również tworzenie niestandardowych formantów przy użyciu UserControl i Control klasy.

Przeciąganie i upuszczanie WPF i Silverlight Designer można łatwo tworzyć aplikacje WPF. Po prostu zaznacz formanty, umieść wskaźnik myszy i dodać miejsce w oknie. Projektanta zapewnia narzędzia, takie jak snaplines i ciągłego powiększanie, aby ułatwić organizowanie kontroli.

Wreszcie, jeśli trzeba utworzyć własne niestandardowe elementy interfejsu użytkownika, System.Windows.Media i System.Windows.Shapes obszarów nazw zawiera duży wybór klas do renderowania linie, okręgi i innych kształtów bezpośrednio w oknie.

Bb514528.collapse_all(pl-pl,VS.110).gifUzyskać pomoc dotyczącą tworzenia systemu Windows i formanty

Uzyskać informacje krok po kroku dotyczące sposobu korzystania z tych funkcji zobacz następujące tematy Pomocy.

Opis

Temat pomocy

Tworzenie nowej aplikacji WPF, z Visual Studio.

Jak: Tworzenie nowego projektu aplikacji WPF

Używając formantów w oknie.

Jak: Wybierz i Przenieś elementy do powierzchni projektu

Tworzenie procedury obsługi zdarzeń dla formantów.

Jak: tworzenie obsługi zdarzenia prostego

Obsługa zdarzeń z okna i kontrolki okna.

Jak: wykorzystanie dołączone zdarzeń

Nawigacja układ WPF i Silverlight.

Przeglądanie hierarchii elementów dokumentu WPF

Tworzenie dynamicznych układów.

Układy w projektancie WPF

Tworzenie niestandardowych WPF formantów.

Jak: Tworzenie projektu biblioteki UserControl WPF

Tworzenie powiązania danych.

Powiązania danych w projektancie WPF

Współpraca z Expression Blend

Funkcja WPF zapewnia silne rozdzielenie zawartości i prezentacji, dzięki czemu możliwe jest dla oprogramowania deweloperom i projektantom graficznego współpracować na wygląd i zachowanie aplikacji. WPF i Silverlight Designer jest zoptymalizowany dla deweloperów oprogramowania i Expression Blend jest zoptymalizowany dla projektantów graficznych. Aby uzyskać więcej informacji, zobacz Współpraca z Expression Blend.

Zobacz też

Koncepcje

Projektant WPF dla deweloperów Windows Forms

Współpraca z Expression Blend

Inne zasoby

Projektant WPF

Biblioteka formantów

XAML w aplikacji WPF