Edgesforextendedlayout scrollviewer

Em um menu WPF ToolBarPanel-ToolBar aninhado, queremos livrar-se da alça de aperto para a esquerda e da área de transbordamento para a direita. Ambos estão acinzentados, mas casam como se não fossem exibidos. Quaisquer idéias sobre como realizar isso apenas no caso de meus termos não serem inteiramente corretos, se você olhar a imagem na Figura 3 do link abaixo, na mais baixa das três barras de ferramentas há a aderência à esquerda do menu suspenso e à direita Do botão mais à direita há o estouro. Clique com o botão direito do mouse na barra de ferramentas e selecione Editar modelo a partir do modelo de edição, selecione Editar uma cópia. Recomendo adicionar a cópia a um dicionário de recursos Clique em OK. Agora, você estará editando o modelo de controle para o ToolBarPanel e pode configurar a visibilidade para Deslocamento para a aderência e Sinal de transbordamento. Você pode enxaguar e repetir para os outros controles. É um pouco demorado, mas não é muito difícil com a Blend. Respondeu 26 de junho 09 às 20: 09Introdução O GridView é um ótimo controle que pode ser usado de muitas maneiras diferentes para exibir conteúdo em mosaico em seus aplicativos da Loja do Windows. Se você já olhou para algum aplicativo WinRT ultimamente, ou mesmo sites do Microsoft Partner, você reconhecerá a popularidade dos azulejos quando se trata de design UI no Windows World. As telhas fornecem uma maneira simples e elegante de organizar uma lista de itens ou áreas de navegação de sua aplicação. Talvez o melhor exemplo de conteúdo em mosaico seja o próprio Windows 8. Ele exibe cada um de seus aplicativos em um mosaico considerável que pode ser reorganizado e agrupado para o desejo dos usuários. Como é típico com aplicativos nativos, os desenvolvedores desejamos emular a mesma experiência em nossas próprias aplicações. Esta imitação remonta aos primeiros dias do Windows e tem sido uma abordagem consistente para as interfaces de usuário. Se você estiver tentando emular a tela de inicialização do Windows 8 no seu próprio aplicativo do Windows Store, o controle do GridView é um ótimo lugar para começar. O Gridview pode exibir telhas de tamanho variável e agrupá-los para você, ou pode exibir itens não agrupados do mesmo tamanho com suporte para arrastar e soltar. Infelizmente, você não pode ter tudo habilitado por padrão. Por exemplo, você não consegue arrastar e soltar para todos os painéis de itens. Certos painéis de itens são necessários se desejar uma mistura de itens de diferentes tamanhos (ou seja, VariableSizedWrapGrid). Também o arrastar e soltar não é suportado quando o agrupamento está habilitado. Este artigo descreve a implementação de um controle gridView ampliado, GridViewEx, que remove essas limitações. O exemplo fornecido permite que você entregue arrastar e soltar em um GridView que tenha suporte para agrupamento e itens de tamanho variável. Se você estiver desenvolvendo para a Plataforma Universal do Windows (UWP) no Windows 10, use a versão atualizada do novo artigo Como atualizar o GridView ampliado do WinRT para a Plataforma Universal Windows (UWP). Antecedentes Primeiro, vamos ver como podemos ativar arrastar e soltar no cenário mais simples. Aqui temos um GridView com propriedades mínimas definidas e um ItemTemplate muito básico. Para ativar a reorganização de arrastar e soltar, você precisa fazer três coisas: Defina a propriedade AllowDrop como verdadeira. Defina a propriedade CanReorderItems como true. Vincule a uma fonte de dados que suporte modificação de dados, ou especificamente reordem. Por exemplo, você poderia usar algo como ObservableCollection ou IList (Nota: GridViews não vinculados também suportam a reordenação). Você notará que muito facilmente temos algum nível de suporte para arrastar e soltar no nosso GridView. Conforme mencionado anteriormente, existem algumas limitações importantes para permitir o arrastar e soltar para cenários vinculados e não vinculados. Especificamente, você não pode agrupar o agrupamento ou uma mistura de itens de tamanho variável. Se você olhar para o Windows 8 Start Screen você notará que há agrupamento, itens de tamanho diferente e arrastar e soltar. Se você realmente estiver tentando imitar essa experiência, você quer que dois ou três desses recursos sejam combinados. Como podemos implementar todos esses recursos em um GridView Precisamos estender o controle para suportar esses outros cenários. Agora, dê uma olhada no controle GridViewEx. O controle GridViewEx O controle GridViewEx implementa arrastar e soltar para casos que não são suportados pelo controle GridView normal: para painéis de itens diferentes de WrapGrid, StackPanel e VirtualizingStackPanel. Quando o agrupamento está habilitado. Ele também permite adicionar novos grupos à fonte de dados subjacente se o usuário arrastar algum item para as bordas mais à esquerda ou à direita do controle. Arrastando o Código Vamos ver a implementação do controle e como lidar com arrastar itens. O controle possui vários campos que armazenam os índices de vários itens ativos durante o processo de dragdrop. O evento OnDragStarting armazena itens arrastados para o valor DragEventArgs. Data. PropertiesItems. Você substitui este método para configurar dados de arrastar personalizados se você precisar. Quando o usuário arrasa um item, precisamos mostrar dicas sobre onde o item será colocado se for descartado. O padrão GridView lida com isso deslizando itens adjacentes fora do caminho. Implementaremos esse comportamento exato no GridViewEx porque precisamos explicar os casos em que o GridView não suporta cair. OnDragOver aplica dicas de reordenação quando um item é arrastado para itens vizinhos. Os itens vizinhos são calculados a partir do método GetIntersectingItems. Existem cinco possíveis ReorderHintStates para definir, dependendo da localização de cada item: NoReorderHint BottomReorderHint TopReorderHint RightReorderHint LeftReorderHint Código de descarte Em seguida, vamos ver o código que lida com a queda. Nós temos que substituir o método GridView. OnDrop que é chamado sempre que um usuário final deixa um item para o novo local. Nossas alças de substituição caem para qualquer ItemPanel que o GridView padrão não suporta cair. O método OnDrop inclui lógica para mover itens de um grupo para outro quando o agrupamento está habilitado e para criação de novos grupos se for solicitada pelas ações do usuário final. Adicionando novos grupos O GridView suporta agrupamento se for vinculado ao CollectionViewSource com a propriedade IsSourceGrouped definida como verdadeira. Isso significa que a lógica de agrupamento deve ser implementada no nível da fonte de dados e o GridView não tem acesso a ela. Aqui vemos que para adicionar novos grupos durante a operação de arrastar e soltar, precisamos de algo mais do que o evento Drop padrão. O evento GridViewEx. BeforeDrop nos permite lidar com esta situação e fornece mais informações, incluindo os dados originais do DragEventArgs. O evento BeforeDrop ocorre antes que o usuário execute uma operação de soltar. O BeforeDropItemEventArgs carrega informações importantes sobre o item que está sendo arrastado para que possa ser acessado mais tarde no evento OnDrop. A propriedade AllowNewGroup determina se novos grupos devem ser criados se o usuário arrastar um item para as bordas distantes do controle. Este recurso não é suportado no GridView padrão em qualquer cenário, de modo que é um bom benefício adicional da classe GridViewEx. Para permitir a criação de novos grupos com operações de arrastar e soltar, você deve definir a propriedade AllowNewGroup como verdadeira. Para lidar com a adição de novos grupos à camada de dados, você deve lidar com o evento GridViewEx. BeforeDrop. Os argumentos do evento ajudam a determinar a origem e o destino dos itens. Dentro do manipulador de eventos BeforeDrop você pode criar o novo grupo de dados e inseri-lo na coleção de grupos na posição especificada pela propriedade NewGroupIndex dos argumentos. A última coisa necessária para adicionar o novo recurso de grupo é estender o modelo de controle GridView padrão. Precisamos de um preenchimento ou espaço reservado, onde o usuário pode arrastar um item para criar um novo grupo. O modelo de controle GridViewEx suporta a adição de novos grupos se o usuário arrastar algum item para a borda de controle mais à esquerda ou à direita. Assim, dois elementos de borda em cada extremidade do ItemsPresenter são espaços reservados para os novos grupos. O modelo de controle GridViewEx de generic. xaml. Estas novas partes de modelo também devem ser definidas no nosso código. Usando e Extendendo o GridViewEx Agora, temos uma solução GridView de arrastar e soltar que, em primeiro lugar, parece ser idêntica ao GridView padrão. Nosso objetivo é que ele se comporte mais como a tela inicial do Windows 8. Vamos discutir como implementar os seguintes dois recursos que, de outra forma, não seriam suportados: itens de tamanho variável A tela inicial do Windows 8 mostra telhas de vários tamanhos (bem, dois tamanhos exatamente). Se você tentar fazer itens de tamanhos diferentes em um GridView ou GridViewEx padrão, ele não funcionará. Isso porque o GridView usa um WrapGrid como seu ItemPanel padrão. WrapGrid cria um layout uniforme onde cada item é do mesmo tamanho. Por esse motivo, a Microsoft também inclui um VariableSizedWrapGrid, que, como o nome indica, suporta itens de diferentes tamanhos. O benefício do controle GridViewEx é que você pode usar VariableSizedWrapGrid e ainda reter o suporte para arrastar e soltar. Para usar a grade VariableSizedWrap e exibir itens de vários tamanhos, você deve fazer duas coisas: Defina o GridViewEx. ItemsPanel para uma instância de VariableSizedWrapGrid. Substitua o método PrepareContainerForItemOverride no GridView. Neste método, você define as propriedades RowSpan ou ColumnSpan nos itens para indicar seu tamanho. Isso significa que precisamos estender o controle GridViewEx com outro controle chamado MyGridView. Por que estender o GridViewEx ao invés de simplesmente substituir PrepareContainerForItemOverride na classe GridViewEx. Como a lógica para especificar o tamanho do item deve estar em seu modelo de dados e não dentro do próprio controle. Ou seja, se você quer deixar GridViewEx como um controle versátil para uso em mais de um lugar. Por exemplo, diga que você deseja que itens específicos apareçam maiores, você criaria uma propriedade em seu item de dados que retornasse um valor inteiro superior a 1 e use isso para definir a propriedade RowSpan ou ColumnSpan. Aqui, quando criamos cada item, especificaremos o ItemSize para ser 1 ou 2 indicando regular (1) ou maior (2). Os itens maiores terão sua propriedade ColumnSpan definida para duas, de modo que ocupe o espaço de dois itens horizontalmente. Você também pode configurar o RowSpan para tornar os itens maiores na vertical também. Agora vamos criar uma instância MyGridView e vinculá-la a uma coleção de itens. No código que inicializa a coleção, definiremos a propriedade ItemSize em determinados itens (a lógica de negócios pode determinar isso) para ser 2, indicando assim uma telha maior que abrange duas colunas. Usando o controle GridViewEx, podemos ativar o agrupamento e arrastar e soltar juntos. Você pode agrupar um controle GridViewEx assim como você habilitaria o agrupamento para o GridView padrão. Na verdade, o modelo da aplicação Grid que você provavelmente iniciou sua aplicação com o agrupamento de usos. Você implementa o agrupamento fazendo duas coisas: Vincule o GridView a um CollectionViewSource com uma fonte de dados habilitada para agrupar. Significando, a fonte de dados deve conter grupos de dados, como cada item contendo uma coleção de itens infantis. O CollectionViewSource atua como um proxy sobre a classe de coleção para habilitar o agrupamento. Especifique um GroupStyle para determinar como os grupos são exibidos. GroupStyle inclui um HeaderTempate e um Painel que especifica como itens filho no grupo são organizados. Opcionalmente, você pode especificar GroupStyle. ContainerStyle. Isso modifica a aparência do recipiente do grupo. Por exemplo, você pode adicionar uma borda ao redor de cada grupo. Permite adicionar agrupamento à nossa implementação MyGridView do GridViewEx. Lembre-se, estendemos GridViewEx para adicionar lógica de negócios para itens de tamanho variável. É importante notar quando o agrupamento está habilitado e um GroupStyle é especificado, o ItemsPanel tem um novo significado. Alteramos ItemsPanel de um VariableSizedWrapGrid para um VirtualizingStackPanel. Com o agrupamento, o ItemsPanel refere-se à forma como os grupos são organizados no GridView. Uma vez que queremos oferecer suporte a diferentes itens de tamanho dentro de cada grupo, mudamos nosso VariableSizedWrapGrid para o modelo GroupStyle. Panel. Execute a amostra e note que temos agrupamento, itens de tamanho variável e agora arraste e solte entre os grupos graças ao controle GridViewEx personalizado. Adicionando novos grupos O controle GridViewEx personalizado também adicionou suporte para adicionar novos grupos quando o usuário arrastar um item para as bordas distante esquerda e direita do controle. Para permitir a criação de novos grupos, defina a propriedade AllowNewGroup como verdadeira. Em seguida, lidar com a adição de novos grupos à camada de dados, lida com o evento GridViewEx. BeforeDrop. Os argumentos do evento ajudam a determinar a origem e o destino dos itens. Dentro do manipulador de eventos BeforeDrop você pode criar o novo grupo de dados e inseri-lo na coleção de grupos na posição especificada pela propriedade NewGroupIndex dos argumentos. A razão pela qual isso é deixado para o desenvolvedor é porque o controle GridViewEx não sabe nada sobre sua estrutura de dados. Também podemos usar o evento Drop para limpar qualquer grupo vazio. Salvando layout ao longo das sessões No Windows 8, o aplicativo pode ser suspenso ou encerrado quando o usuário se afastar dele. Para uma melhor experiência do usuário, nossa amostra armazena o layout atual quando o usuário final navega para a outra página ou quando o aplicativo está desativado. Nesta amostra, usamos a serialização de dados mais simples para a cadeia JSON. Dependendo da sua estrutura de dados, tamanho de dados e suas necessidades, você pode salvar dados em outro formato e para o outro lugar. No nosso caso, basta salvar a coleção de objetos de negócios subjacentes. Para salvar o layout da página, usamos substituições para os métodos LayoutAwarePage (veja os comentários no código): o código acima serializa o layout para o estado da página. Então, nosso aplicativo de exemplo usa SuspensionManager para salvar essas informações junto com o estado do aplicativo. Você pode encontrar o código completo nas amostras anexadas. Se você precisar de mais informações sobre como salvar o estado dos aplicativos, comece com o artigo MSDN Gerencie o ciclo de vida e o estado do aplicativo. O controle GridViewEx personalizado permite combinar vários recursos úteis do controle GridView. Aproveitar mais recursos nos permite oferecer experiências de usuários que estão se tornando a nova norma quando se trata do desenvolvimento de aplicativos do Windows Store. Há mais o que podemos fazer nos nossos itens GridView para que eles se comportem como a tela inicial do Windows 8. Por exemplo, as telhas de início estão vivas à medida que rodam através de conteúdo atualizado. Você pode tirar proveito de bibliotecas de telhas de terceiros, como os controles do ComponentOne Tiles e usá-los dentro de um GridView para entregar telas animadas que flip e rote para exibir dados ao vivo. Uma segunda amostra com telhas ao vivo também está anexada e mostra os controles C1Tile em uso com o controle GridViewEx. Atualização (1 de outubro de 2015): as amostras foram atualizadas para o Windows 8.1