I'm developing an addin for excel and I want to know What is Contoso and if i can replace it for another thing.
In my manifest file i have this:
<Label resid="Contoso.TaskpaneButton.Label" />
<Supertip>
<!-- ToolTip title. resid must point to a ShortString resource. -->
<Title resid="Contoso.TaskpaneButton.Label" />
<!-- ToolTip description. resid must point to a LongString resource. -->
<Description resid="Contoso.TaskpaneButton.Tooltip" />
</Supertip>
<Icon>
<bt:Image size="16" resid="Contoso.tpicon_16x16" />
<bt:Image size="32" resid="Contoso.tpicon_32x32" />
<bt:Image size="80" resid="Contoso.tpicon_80x80" />
</Icon>
For example, can i replace <Label resid="Contoso.TaskpaneButton.Label" /> to <Label resid="Anything.TaskpaneButton.Label" />
Related
I tried in different ways to replace default app icon but its not working for me.i added custom icons res/icons/ios in this path. when I build my cordova app on remote device(ipad) its always showing default app icon.if anyone help me to solve my problem? I also added following lines into my config.xml file.
*
<platform name="android">
<!--
ldpi : 36x36 px
mdpi : 48x48 px
hdpi : 72x72 px
xhdpi : 96x96 px
xxhdpi : 144x144 px
xxxhdpi : 192x192 px
-->
<icon src="res/android/ldpi.png" density="ldpi" />
<icon src="res/android/mdpi.png" density="mdpi" />
<icon src="res/android/hdpi.png" density="hdpi" />
<icon src="res/android/xhdpi.png" density="xhdpi" />
<icon src="res/android/xxhdpi.png" density="xxhdpi" />
<icon src="res/android/xxxhdpi.png" density="xxxhdpi" />
</platform>
<platform name="ios">
<!-- iOS 8.0+ -->
<!-- iPhone 6 Plus -->
<icon src="res/ios/icon-60-3x.png" width="180" height="180" />
<!-- iOS 7.0+ -->
<!-- iPhone / iPod Touch -->
<icon src="res/ios/icon-60.png" width="60" height="60" />
<icon src="res/ios/icon-60-2x.png" width="120" height="120" />
<!-- iPad -->
<icon src="res/ios/icon-76.png" width="76" height="76" />
<icon src="res/ios/icon-60-2x.png" width="152" height="152" />
<!-- iOS 6.1 -->
<!-- Spotlight Icon -->
<icon src="res/ios/icon-40.png" width="40" height="40" />
<icon src="res/ios/icon-40-2x.png" width="80" height="80" />
<!-- iPhone / iPod Touch -->
<icon src="res/ios/icon.png" width="60" height="60" />
<icon src="res/ios/icon-2x.png" width="120" height="120" />
<!-- iPad -->
<icon src="res/ios/icon-72.png" width="72" height="72" />
<icon src="res/ios/icon-72-2x.png" width="144" height="144" />
<!-- iPhone Spotlight and Settings Icon -->
<icon src="res/ios/icon-small.png" width="29" height="29" />
<icon src="res/ios/icon-small-2x.png" width="58" height="58" />
<!-- iPad Spotlight and Settings Icon -->
<icon src="res/ios/icon-50.png" width="50" height="50" />
<icon src="res/ios/icon-50-2x.png" width="100" height="100" />
</platform>
You need to open your project in xcode and find the Resources folder -> images.xsassets
http://ticons.fokkezb.nl/
above link is useful for create your icon and splash-screen for your ios application.
once that downloaded you drag and drop icons in appicon and splashscreen in lanchimage
I hope this work for you.
I have a view with in the center a GridPane which fills the whole screen. The GridPane has percentages defined on all rows and all columns. On my Nexus 5X the layout works normal. When I install the app on a Zebra Scanner TC8000, which is an Android 4.4.3, the percentages are not respected. Instead roughly the upper 50% is shown and the rest disappears much like the screen is too small.
The resolution on the Zebra is much less of course, 480x800 vs 1080x1920 on the 5X but I expected that the components would scale down according to the percentages of the GridPane. Does anyone know what's going wrong.
Edit: I tried many different things and the best code I got atm is the code below. The problems this code has are:
- The first row takes up 55% of the screen height instead of the 30% that is configured.
- The components leave the screen in width by approximatly 50 - 100 pixels. If this one is solved the layout becomes acceptable.
<?xml version="1.0" encoding="UTF-8"?>
<?import com.gluonhq.charm.glisten.mvc.View?>
<?import javafx.geometry.Insets?>
<?import javafx.geometry.Rectangle2D?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.Pane?>
<?import javafx.scene.layout.Region?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>
<View fx:id="product" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" xmlns="http://javafx.com/javafx/8.0.65" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.essers.pxl2016.scan.application.gluon.views.ProductPresenter">
<padding>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</padding>
<top>
<HBox fx:id="buttonHBox" alignment="CENTER_LEFT" cacheShape="false" BorderPane.alignment="CENTER">
<children>
<Label fx:id="descriptionLabel">
<font>
<Font name="System Bold" size="15.0" />
</font>
<HBox.margin>
<Insets />
</HBox.margin>
</Label>
<Region HBox.hgrow="ALWAYS" />
<Button fx:id="exitButton" mnemonicParsing="false" text="Exit">
<HBox.margin>
<Insets />
</HBox.margin>
</Button>
</children>
</HBox>
</top>
<center>
<GridPane>
<columnConstraints>
<ColumnConstraints fillWidth="false" percentWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints percentHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints percentHeight="20.0" vgrow="SOMETIMES" />
<RowConstraints percentHeight="50.0" vgrow="SOMETIMES" />
</rowConstraints>
<children>
<GridPane hgap="4.0" vgap="4.0">
<columnConstraints>
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" percentWidth="15.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" percentWidth="15.0" />
<ColumnConstraints halignment="LEFT" hgrow="SOMETIMES" percentWidth="45.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" percentWidth="25.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints percentHeight="7.5" vgrow="SOMETIMES" />
<RowConstraints percentHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints percentHeight="5.0" vgrow="SOMETIMES" />
<RowConstraints percentHeight="7.5" vgrow="SOMETIMES" />
<RowConstraints percentHeight="45.0" valignment="CENTER" vgrow="ALWAYS" />
<RowConstraints percentHeight="5.0" vgrow="SOMETIMES" />
</rowConstraints>
<children>
<VBox alignment="CENTER" spacing="5.0" GridPane.rowIndex="4">
<children>
<Button fx:id="plusButton" alignment="CENTER" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#plusClicked" text="+" textAlignment="CENTER" VBox.vgrow="ALWAYS">
<VBox.margin>
<Insets />
</VBox.margin>
</Button>
<Button fx:id="minButton" alignment="CENTER" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#minClicked" text="-" textAlignment="CENTER" VBox.vgrow="ALWAYS">
<VBox.margin>
<Insets />
</VBox.margin>
</Button>
</children>
<GridPane.margin>
<Insets />
</GridPane.margin>
</VBox>
<Label text="Count" textAlignment="CENTER" GridPane.columnIndex="1" GridPane.rowIndex="3">
<font>
<Font size="11.0" />
</font>
</Label>
<Label alignment="CENTER" contentDisplay="CENTER" nodeOrientation="LEFT_TO_RIGHT" text="Scanned barcode" textAlignment="CENTER" GridPane.columnIndex="2" GridPane.rowIndex="3">
<font>
<Font size="11.0" />
</font>
<GridPane.margin>
<Insets left="5.0" />
</GridPane.margin>
</Label>
<Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#okClicked" text="OK" GridPane.columnIndex="3" GridPane.rowIndex="4">
<GridPane.margin>
<Insets />
</GridPane.margin>
</Button>
<Label text="Target">
<font>
<Font size="11.0" />
</font>
</Label>
<Label text="Scanned" GridPane.columnIndex="1">
<font>
<Font size="11.0" />
</font>
</Label>
<Label alignment="CENTER" text="Target barcode" GridPane.columnIndex="2">
<font>
<Font size="11.0" />
</font>
<padding>
<Insets left="5.0" />
</padding>
</Label>
<TextField fx:id="targetCountTextField" alignment="CENTER" disable="true" editable="false" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" text="5" GridPane.rowIndex="1" />
<TextField fx:id="countTextField" alignment="CENTER" maxHeight="1.7976931348623157E308" text="1" GridPane.columnIndex="1" GridPane.hgrow="ALWAYS" GridPane.rowIndex="4" GridPane.rowSpan="2" GridPane.vgrow="ALWAYS" />
<TextField fx:id="targetBarcodeTextField" disable="true" editable="false" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" GridPane.columnIndex="2" GridPane.rowIndex="1">
<opaqueInsets>
<Insets left="5.0" />
</opaqueInsets>
</TextField>
<TextField fx:id="scannedCountTextField" alignment="CENTER" disable="true" editable="false" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" text="0" GridPane.columnIndex="1" GridPane.rowIndex="1" />
<TextField fx:id="scannedBarcodeTextField" maxHeight="1.7976931348623157E308" onKeyPressed="#handleKeyPress" GridPane.columnIndex="2" GridPane.rowIndex="4" GridPane.rowSpan="2">
<opaqueInsets>
<Insets left="5.0" />
</opaqueInsets>
</TextField>
<Button fx:id="skipButton" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#skipClicked" text="Skip" GridPane.columnIndex="3" GridPane.hgrow="ALWAYS" GridPane.rowIndex="1" GridPane.vgrow="ALWAYS" />
</children>
</GridPane>
<GridPane GridPane.rowIndex="1">
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="0.0" percentWidth="29.0" prefWidth="0.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" percentWidth="31.0" prefWidth="100.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" percentWidth="15.0" prefWidth="100.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" percentWidth="25.0" prefWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints vgrow="SOMETIMES" />
<RowConstraints vgrow="SOMETIMES" />
<RowConstraints vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
</rowConstraints>
<children>
<Label text="Id:" />
<Label text="Location:" GridPane.rowIndex="1" />
<Label text="Description:" GridPane.rowIndex="2" />
<Label text="Comment:" GridPane.rowIndex="3" />
<Label text="Status:" GridPane.columnIndex="2" GridPane.rowIndex="1" />
<Label text="Unit:" GridPane.columnIndex="2" />
<Label fx:id="idLabel" GridPane.columnIndex="1" />
<Label fx:id="locationLabel" GridPane.columnIndex="1" GridPane.rowIndex="1" />
<Label fx:id="longDescriptionLabel" wrapText="true" GridPane.columnIndex="1" GridPane.columnSpan="3" GridPane.rowIndex="2" />
<Label fx:id="commentLabel" wrapText="true" GridPane.columnIndex="1" GridPane.columnSpan="3" GridPane.rowIndex="3" />
<Label fx:id="statusLabel" GridPane.columnIndex="3" GridPane.rowIndex="1" />
<Label fx:id="unitLabel" GridPane.columnIndex="3" />
</children>
</GridPane>
<VBox GridPane.rowIndex="2" GridPane.vgrow="ALWAYS">
<children>
<Pane fx:id="pane" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" VBox.vgrow="ALWAYS">
<children>
<StackPane fx:id="imagePane" alignment="TOP_LEFT" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308">
<children>
<ImageView fx:id="imageView" onMouseClicked="#imageClicked" pickOnBounds="true" preserveRatio="true" StackPane.alignment="CENTER">
<viewport>
<Rectangle2D />
</viewport>
</ImageView>
<Button fx:id="videoButton" disable="true" mnemonicParsing="false" onAction="#videoButtonClicked" text="Video" visible="false" StackPane.alignment="TOP_RIGHT">
<StackPane.margin>
<Insets right="3.0" top="3.0" />
</StackPane.margin>
</Button>
</children>
</StackPane>
</children>
</Pane>
<Label fx:id="figLabel" alignment="TOP_LEFT" />
</children>
</VBox>
</children>
</GridPane>
</center>
</View>
You can reproduce the issue if you run your app on Desktop, and set the stage dimensions to 320x600:
#Override
public void postInit(Scene scene) {
scene.getWindow().setWidth(320);
scene.getWindow().setHeight(600);
}
Using ScenicView you'll notice that the view has 370 px width, because the minimum width for the top inner grid is 360 px.
While you haven't set any minimum value for any control, you can see that the styled buttons don't resize down properly, as the minimum width is set by css.
Try adding this to remove their minimum width value:
.view {
}
.button {
-fx-min-width: 10;
}
Now the view should be within the bound of the mobile screen:
The problem was that I put a button in a small width column. In SceneBuilder and on devices width high resolutions, the layout looked fine but when displayed on a small screen, the button became too wide for the column. In response, the View was resized to a bigger maximum width and because the width already filled the screen, it now exceeded the screen.
Imo the button should be resized or scaled down to fit the GridPane cell. Also, the minimum size of the button used in the calculations is quite wide, even though my button only had a plus-sign in it.
I declare several converters in my App.xaml as follows but I am repeating myself which I really would like to avoid:
<c:ConverterChain x:Key="IsNotNull">
<c:IsNullConverter />
<c:InvertBoolConverter />
</c:ConverterChain>
<c:ConverterChain x:Key="HideWhenNull">
<c:IsNullConverter />
<c:InvertBoolConverter />
<c:BoolToFromVisibilityConverter FalseEquivalent="Hidden" />
</c:ConverterChain>
<c:ConverterChain x:Key="CollapseWhenNull">
<c:IsNullConverter />
<c:InvertBoolConverter />
<c:BoolToFromVisibilityConverter FalseEquivalent="Collapsed" />
</c:ConverterChain>
As you can see the IsNotNull could be reused in the two following converter chains, but is it possible to declare that somehow? I'm thinking of something like:
<c:ConverterChain x:Key="HideWhenNull">
<Reference Name="IsNotNull" />
<c:BoolToFromVisibilityConverter FalseEquivalent="Hidden" />
</c:ConverterChain>
Is there some WPF concept out there to cover this use case?
<c:ConverterChain x:Key="HideWhenNull">
<DynamicResource ResourceKey="IsNotNull"/>
<c:BoolToFromVisibilityConverter FalseEquivalent="Hidden" />
</c:ConverterChain>
As long as the ConverterChain class supports nesting.
Inspired by Khyads answer I opted for StaticResource instead of DynamicResource because there is no need for the extra overhead Dynamic implies and it works just fine with a static resource:
<c:ConverterChain x:Key="HideWhenNull">
<StaticResource ResourceKey="IsNotNull" />
<c:BoolToFromVisibilityConverter FalseEquivalent="Hidden" />
</c:ConverterChain>
I have the following ComboBox declared in a custom Dialog:
<Control Id="EnvironmentCombobox" Type="ComboBox" Sorted="yes" ComboList="yes" Property="ENVIRONMENT" X="25" Y="110" Width="200" Height="15">
<ComboBox Property="ENVIRONMENT">
<ListItem Text="Development" Value="Development" />
<ListItem Text="SIT" Value="SIT" />
<ListItem Text="UAT" Value="UAT" />
<ListItem Text="Production" Value="Production" />
</ComboBox>
</Control>
When I run my installer and get to that dialog, the ComboBox doesn't show until I run my mouse over it. It also appears when if I hit a navigation button. If I leave and come back to the dialog, it is gone again, until I mouse over it or hit a navigation button.
I've tried setting Hidden="no" and increasing the height, but no luck.
Adding full files, per request in comments.
The above is in the EnvironmentDlg:
<?xml version="1.0" encoding="UTF-8"?>
<Wix xmlns="http://schemas.microsoft.com/wix/2006/wi">
<Fragment>
<UI>
<Dialog Id="EnvironmentDlg" Width="370" Height="270" Title="[ProductName] Setup">
<!-- Layout. -->
<Control Id="BannerBitmap" Type="Bitmap" X="0" Y="0" Width="370" Height="44" TabSkip="no" Text="!(loc.LicenseAgreementDlgBannerBitmap)" />
<Control Id="BannerLine" Type="Line" X="0" Y="44" Width="370" Height="0" />
<Control Id="BottomLine" Type="Line" X="0" Y="234" Width="370" Height="0" />
<!-- Content. -->
<Control Id="Title" Type="Text" X="15" Y="15" Width="300" Height="15" Transparent="yes" NoPrefix="yes" Text="{\WixUI_Font_Title}Choose environment for [ProductName]" />
<Control Id="InstallText" Type="Text" X="25" Y="70" Width="320" Height="80" Text="Choose the environment to which [ProductName] is being installed." />
<Control Id="EnvironmentCombobox" Type="ComboBox" Sorted="yes" ComboList="yes" Property="ENVIRONMENT" X="25" Y="110" Width="200" Height="15">
<ComboBox Property="ENVIRONMENT">
<ListItem Text="Development" Value="Development" />
<ListItem Text="SIT" Value="SIT" />
<ListItem Text="UAT" Value="UAT" />
<ListItem Text="Production" Value="Production" />
</ComboBox>
</Control>
<!-- Navigation. -->
<Control Id="Back" Type="PushButton" X="180" Y="243" Width="56" Height="17" Text="!(loc.WixUIBack)" />
<Control Id="Next" Type="PushButton" X="236" Y="243" Width="56" Height="17" Default="yes" Text="!(loc.WixUINext)">
<!-- Don't allow user to continue until they have selected an environment. -->
<Condition Action="disable">ENVIRONMENT = ""</Condition>
<Condition Action="enable"><![CDATA[ENVIRONMENT <> ""]]></Condition>
</Control>
<Control Id="Cancel" Type="PushButton" X="304" Y="243" Width="56" Height="17" Cancel="yes" Text="!(loc.WixUICancel)">
<Publish Event="SpawnDialog" Value="CancelDlg">1</Publish>
</Control>
</Dialog>
</UI>
</Fragment>
</Wix>
The sequence is in MyWixUI_Unsecured:
<?xml version="1.0" encoding="UTF-8"?>
<Wix xmlns="http://schemas.microsoft.com/wix/2006/wi">
<Fragment>
<UI Id="MyWixUI_Unsecured">
<TextStyle Id="WixUI_Font_Normal" FaceName="Tahoma" Size="8" />
<TextStyle Id="WixUI_Font_Bigger" FaceName="Tahoma" Size="12" />
<TextStyle Id="WixUI_Font_Title" FaceName="Tahoma" Size="9" Bold="yes" />
<Property Id="DefaultUIFont" Value="WixUI_Font_Normal" />
<DialogRef Id="ErrorDlg" />
<DialogRef Id="FatalError" />
<DialogRef Id="FilesInUse" />
<DialogRef Id="MsiRMFilesInUse" />
<DialogRef Id="PrepareDlg" />
<DialogRef Id="ProgressDlg" />
<DialogRef Id="ResumeDlg" />
<DialogRef Id="UserExit" />
<Publish Dialog="ExitDialog" Control="Finish" Event="EndDialog" Value="Return" Order="999">1</Publish>
<Publish Dialog="WelcomeDlg" Control="Next" Event="NewDialog" Value="EnvironmentDlg">1</Publish>
<Publish Dialog="EnvironmentDlg" Control="Back" Event="NewDialog" Value="WelcomeDlg">1</Publish>
<Publish Dialog="EnvironmentDlg" Control="Next" Event="NewDialog" Value="VerifyReadyDlg">1</Publish>
<Publish Dialog="VerifyReadyDlg" Control="Back" Event="NewDialog" Value="EnvironmentDlg">1</Publish>
</UI>
<UIRef Id="WixUI_Common" />
</Fragment>
</Wix>
The issue is regarding the Height of InstallText control in EnvironmentDlg.
Change the Height to 25
<Control Id="InstallText" Type="Text" X="25" Y="70" Width="320" Height="25" Text="Choose the environment to which [ProductName] is being installed." />
Full Code:
<?xml version="1.0" encoding="utf-8"?>
<Wix xmlns="http://schemas.microsoft.com/wix/2006/wi">
<Fragment>
<UI>
<Dialog Id="EnvironmentDlg" Width="370" Height="270" Title="[ProductName] Setup">
<!-- Layout. -->
<Control Id="BannerBitmap" Type="Bitmap" X="0" Y="0" Width="370" Height="44" TabSkip="no" Text="!(loc.LicenseAgreementDlgBannerBitmap)" />
<Control Id="BannerLine" Type="Line" X="0" Y="44" Width="370" Height="0" />
<Control Id="BottomLine" Type="Line" X="0" Y="234" Width="370" Height="0" />
<!-- Content. -->
<Control Id="Title" Type="Text" X="15" Y="15" Width="300" Height="15" Transparent="yes" NoPrefix="yes" Text="{\WixUI_Font_Title}Choose environment for [ProductName]" />
<Control Id="InstallText" Type="Text" X="25" Y="70" Width="320" Height="25" Text="Choose the environment to which [ProductName] is being installed." />
<Control Id="EnvironmentCombobox" Type="ComboBox" Sorted="yes" ComboList="yes" Property="ENVIRONMENT" X="25" Y="110" Width="200" Height="15">
<ComboBox Property="ENVIRONMENT">
<ListItem Text="Development" Value="Development" />
<ListItem Text="SIT" Value="SIT" />
<ListItem Text="UAT" Value="UAT" />
<ListItem Text="Production" Value="Production" />
</ComboBox>
</Control>
<!-- Navigation. -->
<Control Id="Back" Type="PushButton" X="180" Y="243" Width="56" Height="17" Text="!(loc.WixUIBack)" />
<Control Id="Next" Type="PushButton" X="236" Y="243" Width="56" Height="17" Default="yes" Text="!(loc.WixUINext)">
<!-- Don't allow user to continue until they have selected an environment. -->
<Condition Action="disable">ENVIRONMENT = ""</Condition>
<Condition Action="enable"><![CDATA[ENVIRONMENT <> ""]]></Condition>
</Control>
<Control Id="Cancel" Type="PushButton" X="304" Y="243" Width="56" Height="17" Cancel="yes" Text="!(loc.WixUICancel)">
<Publish Event="SpawnDialog" Value="CancelDlg">1</Publish>
</Control>
</Dialog>
</UI>
</Fragment>
</Wix>
I will suggest you using WixEdit control for designing UI
have my store and my grid panel, i need to add a filter box to it , so added a topbar tag, that has the field box to filter.. and want to add listeners on it so i would be filterer while writing, the 2 functions as shown are filtergrid() and clearFilter()...what those 2 functions should be, knowing that the store is binded with code behind...
<ext:Store ID="Store1" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="FULLNAME" />
<ext:RecordField Name="JOBTITLE" />
<ext:RecordField Name="PHONENUMBER1" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Panel ID="Panel1" runat="server" Width="520" Height="300" Collapsible="true" Title="Add Attendies" Collapsed="true">
<TopBar>
<ext:Toolbar ID="Toolbar2" runat="server">
<Items>
<ext:ToolbarTextItem ID="ToolbarTextItem1" runat="server" Text="Filter:" />
<ext:ToolbarSpacer />
<ext:TriggerField ID="TriggerField1" runat="server" EnableKeyEvents="true">
<Triggers>
<ext:FieldTrigger Icon="Clear" />
</Triggers>
<Listeners>
**<KeyUp Fn="filtergrid()" Buffer="250" />
<TriggerClick Handler="clearFilter();" />**
</Listeners>
</ext:TriggerField>
</Items>
</ext:Toolbar>
</TopBar>
<Items>
<ext:BorderLayout ID="BorderLayout1" runat="server">
<West MarginsSummary="5 5 5 5">
<ext:GridPanel
ID="GridPanel1"
runat="server"
StoreID="Store1"
DDGroup="GridDDGroup"
EnableDragDrop="true"
StripeRows="true"
AutoExpandColumn="FULLNAME"
Width="250"
Title="All Contacts">
<ColumnModel>
<Columns>
<ext:Column Header="Contact Name" ColumnID="FULLNAME" Width="140" DataIndex="FULLNAME" />
<ext:Column Header="Title" ColumnID="JOBTITLE" Width="75" DataIndex="JOBTITLE" />
<ext:Column Header="Phone" ColumnID="PHONENUMBER1" Width="75" DataIndex="PHONENUMBER1" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
</SelectionModel>
<GetDragDropText Fn="getDragDropText" />
<Listeners>
<Render Fn="setDD" />
</Listeners>
</ext:GridPanel>
</West>
<Center MarginsSummary="5 5 5 0">
<ext:GridPanel
ID="GridPanel2"
runat="server"
StoreID="Store2"
DDGroup="GridDDGroup"
EnableDragDrop="true"
StripeRows="true"
AutoExpandColumn="FULLNAME"
Width="250"
Title="Meeting Attendies">
<ColumnModel>
<Columns>
<ext:Column ColumnID="Contact Name" Header="Contact Name" Width="140" DataIndex="FULLNAME" />
<ext:Column Header="Title" Width="75" DataIndex="JOBTITLE" />
<ext:Column Header="Phone Number" Width="75" DataIndex="PHONENUMBER1" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel2" runat="server" />
</SelectionModel>
<GetDragDropText Fn="getDragDropText" />
<Listeners>
<Render Fn="setDD" />
</Listeners>
</ext:GridPanel>
</Center>
</ext:BorderLayout>
</Items>
<BottomBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:ToolbarFill ID="ToolbarFill1" runat="server" />
<ext:Button ID="Button1" runat="server" Text="Reset both grids">
<Listeners>
<Click Handler="Store1.loadData(Store1.proxy.data);Store2.removeAll();" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</BottomBar>
</ext:Panel>
so there is 2 functions that i have to write , one that filter an return the result to be written in the panel, and the other one is to clear and restore the datasource again.
You can apply a filter using the filterBy method and passing a delegate function which returns true or false based on some logic of your choosing and then remove the filter using clearFilter
In mode cody terms, something like this:
clearFilter() {
theGridPanel.store.clearFilter(false);
}
filterGrid() {
theGridPanel.store.filterBy(theFilterFunction)
}
theFilterFunction(record, id) {
if(record.data.aField === 'yellow') {
return true;
}
return false;
}